rem和em的區別。以及如何使用。

2021-08-23 12:25:08 字數 442 閱讀 8434

em會繼承父級元素的字型大小。

em是相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸。

使用rem為元素設定字型大小時,仍然是相對大小,但相對的只是html根元素

(直接引入下面的js**就可實現自適應字型)

如果我們需要的是實現字型自適應,不需要手動重新整理,就需要js去封裝  rem 單位。

var fun=function(doc,win)else

} if(!doc.addeventlistener) return;

win.addeventlistener(resizeevt,recalc,false);

doc.addeventlistener('domcontentloaded',recalc,false);  

}fun(document,window);

em和rem的區別

rem單位 rem root em 是乙個相對單位,類似於em,em是父元素字型大小。不同的是rem的基準是相對於html元素的字型大小而不是相對于父元素字型的大小。這樣可以根據螢幕的尺寸,比較容易的控制頁面的布局效果。例如,根元素 html 設定font size 16px 非根元素設定width...

rem與em的使用和區別

區別是 瀏覽器根據誰來轉化成px值。當使用rem單位,轉換為畫素大小取決於根元素的字型大小,即html元素的字型大小。有乙個比較普遍的誤解,認為em單位是相對于父元素的字型大小。事實上,根據w3c標準,它們是相對於使用em單位的元素的字型的大小。父元素的字型大小可以影響 em 值,但這種情況的發生,...

rem與em的區別 結合使用rem與em

注意 谷歌瀏覽器最低支援的font size為12px 火狐和ie瀏覽器沒限制 rem 作用 適用不同解析度的頁面 相對於根元素html 給html設定乙個font size 所有元素的長度單位都用rem 倍數關係 若html設定的font size 10px 那麼2rem就是20px 好處 不同解...