1、概念

px：絕對單位，頁面按精確像素展示。

em：相對單位，基準(zhǔn)點(diǎn)為父節(jié)點(diǎn)字體的大小，如果自身定義了font-size按自身來計算（瀏覽器默認(rèn)字體是16px），整個頁面內(nèi)1em不是一個固定的值。

rem：相對單位，可理解為”root em”, 相對根節(jié)點(diǎn)html的字體大小來計算，CSS3新加屬性，chrome/firefox/IE9+支持。

2、特點(diǎn)

PX特點(diǎn)：

1. IE無法調(diào)整那些使用px作為單位的字體大??；

2. 國外的大部分網(wǎng)站能夠調(diào)整的原因在于其使用了em或rem作為字體單位；

3. Firefox能夠調(diào)整px和em，rem，但是96%以上的中國網(wǎng)民使用IE瀏覽器(或內(nèi)核)。

EM特點(diǎn) ：

1. em的值并不是固定的；

2. em會繼承父級元素的字體大小。

rem特點(diǎn)：

rem是CSS3新增的一個相對單位（root em，根em），這個單位引起了廣泛關(guān)注。區(qū)別在于使用rem為元素設(shè)定字體大小時，仍然是相對大小，但相對的只是HTML根元素。

這個單位可謂集相對大小和絕對大小的優(yōu)點(diǎn)于一身，通過它既可以做到只修改根元素就成比例地調(diào)整所有字體大小，又可以避免字體大小逐層復(fù)合的連鎖反應(yīng)。

目前，除了IE8及更早版本外，所有瀏覽器均已支持rem。對于不支持它的瀏覽器，應(yīng)對方法也很簡單，就是多寫一個絕對單位的聲明。這些瀏覽器會忽略用rem設(shè)定的字體大小。

擴(kuò)展資料

選擇使用什么字體單位主要由項目來決定，如果你的用戶群都使用最新版的瀏覽器，那推薦使用rem，如果要考慮兼容性，那就使用px,或者兩者同時使用。

無論是臺式還是移動端開發(fā)，兩者其實都可以使用，只不過em需要注意繼承關(guān)系，并且需要修改多個內(nèi)容，而rem恰恰相反，所以rem更適合移動式開發(fā)。

也就是說，em是以自身父容器為參考對象的，而rem直接以HTML為參考對象的，在多層嵌套的情況下使用em很容易出現(xiàn)問題。