在調用CSS

一個JavaScript函數，我發現這個功能在另一個線程返回一個網頁的寬度：在調用CSS

<script> 
    function getWindowSize(){ 
     var d= document, root= d.documentElement, body= d.body; 
     var wid= window.innerWidth || root.clientWidth || body.clientWidth, 
     return [hi] 
    } 
</script>

我想我的屏幕上的文字，以規模基於頁面的寬度。這樣做可能有更好的方式，但這是我想到的。如果有更好的方法，我一定想知道。無論如何，讓我們繼續：

<p class="purple center" style="font-size: 'getWindowSize()/10'px;">Navigation</p>

我想在這裏做的就是運行JS的方法，通過10得到的寬度，鴻溝，那麼大小字「導航」相應。

來源

2017-09-26 Tfarcraw IIV

不，但您可以使用'vw'單位。通常，您只需設置斷點即可爲各種寬度設置最佳尺寸。 – Phix

只需訪問js中的'p'並動態更改'style.fontSize' – Ramanlfc

@Ramanlfc人們如何去做這件事？ –

爲正在調整瀏覽器窗口這就會自動調整，並且使用只有css：

.purple { 
 
    font-size: 10vw; 
 
    }

<p class="purple center">Navigation</p>

作爲評論由igarciaoliver：

vw和vh是基於視口的高度和寬度的單元。 1vw =相對於視口寬度的1％ - 1vh =相對至視口高度的1％。

來源

2017-09-26 02:44:42 connexo

澄清：vw和vh是基於窗口寬度和高度的單位。vw =相對於視口寬度的1％ - vh =相對於視口高度的1％ – igarciaoliver

這值得添加到答案中，謝謝。 – connexo

我不認爲有可能從CSS調用JS。 CSS是爲了造型。你可以通過JS訪問CSS元素並動態改變它們的方面。

看看這個例子對於如何與JS更改CSS：如果你想使用jQuery有一些方法來更改CSS太

https://www.w3schools.com/js/js_htmldom_css.asp

另外： http://api.jquery.com/css/ https://www.w3schools.com/jquery/css_css.asp

來源

2017-09-26 02:18:01

CSS不能調用JS函數。

JS中的CSS可以動態設計樣式。

試試這個代碼，

HTML

<p id="sizing">hi</p>

window.onload = function() { 
    (function getWindowSize() { 
     var el = document.getElementById('sizing'); 

     var d = document, root= d.documentElement, body= d.body; 
     var wid = window.innerWidth || root.clientWidth || body.clientWidth; 

     return el.style.fontSize = (wid/12)+"px"; 
    })(); 
};

美好的一天〜

來源

2017-09-26 02:26:19

回答

相關問題