• px畫素（Pixel）。相對長度單位。畫素px是相對於顯示器螢幕解析度而言的。

• em是相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定，則相對於瀏覽器的預設字型尺寸，最初是指字母M的寬度，故名em。現指的是字元寬度的倍數，用法類似百分比，如：0.5em, 1em,2em等，通常1em=16px，為了簡化font -size的換算，可以在css中的body選擇器中宣告Font-size=62.5%，這就使em值變為16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數值除以10，然後換上em作為單位就行了。

  em有如下特點：

1. 因為“em”就是一個相對值，em的值並不是固定的；

2. em會繼續父級元素的字型大小。

3. 計算公式：1 ÷ 父元素的字型大小 × 需要轉換的畫素值 = em值，這樣的情況下“1.4em”可以            是“14px”,也可以是“20px”，或者說是“24px”。

• rem（root em，根em）：是CSS3新增的一個相對單位，相對的只是HTML根元素，可以只修改根元素就可以成比例地調整所有字型大小，又可以避免字型大小逐層複合的連鎖反應。相容性IE9+都可以相容，對於不相容的瀏覽器寫一個絕對單位的宣告就可以了。

  
  
  

• 3、pt (point，磅)：是一個物理長度單位，指的是72分之一英寸。pt=1/72(英寸), px=1/dpi(英寸)
  

一個px、em、pt單位轉換工具：

地址：http://pxtoem.com/

• px畫素（Pixel）。相對長度單位。畫素px是相對於顯示器螢幕解析度而言的。

• em是相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定，則相對於瀏覽器的預設字型尺寸，最初是指字母M的寬度，故名em。現指的是字元寬度的倍數，用法類似百分比，如：0.5em, 1em,2em等，通常1em=16px，為了簡化font -size的換算，可以在css中的body選擇器中宣告Font-size=62.5%，這就使em值變為16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數值除以10，然後換上em作為單位就行了。

  em有如下特點：

1. 因為“em”就是一個相對值，em的值並不是固定的；

2. em會繼續父級元素的字型大小。

3. 計算公式：1 ÷ 父元素的字型大小 × 需要轉換的畫素值 = em值，這樣的情況下“1.4em”可以            是“14px”,也可以是“20px”，或者說是“24px”。

• rem（root em，根em）：是CSS3新增的一個相對單位，相對的只是HTML根元素，可以只修改根元素就可以成比例地調整所有字型大小，又可以避免字型大小逐層複合的連鎖反應。相容性IE9+都可以相容，對於不相容的瀏覽器寫一個絕對單位的宣告就可以了。

  
  
  

• 3、pt (point，磅)：是一個物理長度單位，指的是72分之一英寸。pt=1/72(英寸), px=1/dpi(英寸)
  

一個px、em、pt單位轉換工具：

地址：http://pxtoem.com/

獲取更多的文章，歡迎關注微信公眾號