CSS中的單位

一、px

絕對單位，頁面按精確像素展現

二、em

em 是相對長度單位，是相對於字體大小這個屬性來計算的。參考的是父節點字體的大小，若是自身定義了字體大小 font-size 則參考自身的字體大小，若是父節點和自己都沒有定義字體大小，則參考瀏覽器默認字體大小，瀏覽器的默認字體大小是16px。

整個頁面內1em不是一個固定的值。

好比說：能夠在body標籤聲明 font-size: 62.5%；body下的子元素好比 div 若是聲明 width: 1em ，則寬度爲 10px，該 div 下的 span 字體大小聲明爲 font-size: 0.5em ，則此時span的字體大小是基於div的，16*62.5*1*0.5 = 5px

三、rem

rem 也是相對長度單位，可是該單位相對於 em 就避免了重複計算，由於它相對的就只是HTML根元素

html {
  font-size: 62.5%;  
}
div {
  font-size: 1rem;
  width: 10rem;
}
span {
  font-size: .5rem;
}

不一樣設備的默認字體大小可能不同，經過相對長度單位設置的字體大小能夠隨着默認字體大小的改變而發生改變