色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css如何讓rem生效

呂致盈1年前6瀏覽0評論

CSS中有很多方法可以讓REM生效,其中最常用的是設置根元素的字體大小,來影響整個頁面的REM值:

html {
font-size: 16px; /*假設1REM=16px*/
}
p {
font-size: 1rem; /*此時1rem=16px*/
}

根據上述代碼,我們設置了html元素的字體大小為16px,這時候1REM就等于16px。在接下來的p標簽里,我們只需要寫1rem,就能達到和16px一樣的效果。

當然,如果我們需要調整REM的值,只需要改變根元素的字體大小即可:

html {
font-size: 20px; /*假設1REM=20px*/
}
p {
font-size: 1rem; /*此時1rem=20px*/
}

當我們把根元素的字體大小改為20px時,1REM就變成了20px。如果我們想保持p標簽的字體大小不變,只需要寫上1rem就好了。

除了設置根元素的字體大小以外,我們還可以使用JavaScript來動態修改REM的值:

window.onload = function() {
var screenWidth = document.documentElement.clientWidth; /*獲取屏幕寬度*/
var html = document.getElementsByTagName('html')[0]; /*獲取html元素*/
html.style.fontSize = screenWidth / 10 + 'px'; /*設置根元素字體大小*/
};

在上述代碼中,我們獲取了屏幕的寬度,然后除以10,將結果賦值給根元素的字體大小。這樣做的效果是,當屏幕寬度增加時,REM的值也會相應地增加。

總的來說,CSS中讓REM生效的方法有很多種,我們可以根據不同的需求選擇不同的方法來實現。