我們在佈局頁面中，總要用到一些有關字型，元素寬度，高度等長度單位，一般pc端常用到畫素單位，移動端用em，rem 單位，它們都有各自的特點，今天總結一下它們的特點、區別 px是Pixel的縮寫，也就是說畫素是指基本原色素及其灰度的基本編碼，由 Picture(影象) 和 Element（元素）這兩個單詞的字母所組成的，如同攝影的相片一樣，數碼影像也具有連續性的濃淡階調。如下圖例子：
px是固定大小的單位,畫素的計算針對（電腦/手機）螢幕的，一個畫素就是螢幕上的一個點，即螢幕解析度的最小單位。
em是emphasize縮寫，是一個相對長度單位。相對於當前物件內文體的字型尺寸。如果沒有人為設定當前物件內文字的字型尺寸，那麼它相對的是瀏覽器預設的字型尺寸（16px）, 基準點為父節點字型的大小，如果自身定義了font-size按自身來計算（瀏覽器預設字型是16px），整個頁面內1em不是一個固定的值,比較適合移動端設定，特別是響應式，運用較多，em在國外用的比較多如下圖例子
rem（font size of the root element） 是css3新增的相對長度單位，它的出現彌補了em不能解決的問題，em是相對於父元素的字型大小，當父級元素字型大小改變時，又得重新計算。rem只相對於根目錄 即HTML元素。所以只要在html標籤上設定字型大小。文件中的字型大小都會以此為參照標準，比較適用於自適應佈局。 如下圖例子：
幾種單位都有各自的優點和缺點，建議根據情況而定