CSS 有幾個不同的單位用於表示長度。

一些設定 CSS 長度的屬性有 width, margin, padding, font-size, border-width, 等。

長度由一個數字和單位組成如 10px, 2em, 等。

數字與單位之間不能出現空格。如果長度值為 0，則可以省略單位。

對於一些 CSS 屬性，長度可以是負數。

有兩種型別的長度單位：絕對和相對。

一、絕對長度

絕對長度單位是一個固定的值，它反應一個真實的物理尺寸。絕對長度單位視輸出介質而定，不依賴於環境（顯示器、解析度、作業系統等）。

• cm、 mm ： 釐米、毫米

• **in ： **英寸 (1in = 96px = 2.54cm)，一般為0.125in。

• px ： 畫素Pixcel (1px = 1/96th of 1in)。畫素或許被認為是最好的"裝置畫素"，畫素px是相對於顯示器螢幕解析度而言的。Windows使用者通常為96DPI（畫素/英寸），96*0.125英寸=12px（網頁常用）

• pt： 點point，大約1/72英寸； (1pt = 1/72in)，一般網頁常用9pt。

• pc： 派卡pica，派卡是印刷行業的長度單位。大約6pt，1/6英寸； (1pc = 12 pt)

換算關係：1in=2.54cm=72pt=6pc

二、相對長度

相對長度單位指定了一個長度相對於另一個長度的屬性。對於不同的裝置相對長度更適用。

• em ：

  相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定，則相對於瀏覽器的預設字型尺寸。一般瀏覽器字型大小預設為16px，則2em == 32px,12px=0.75em,10px=0.625em。
  em會繼承父級元素的字型大小
  為了簡化font-size的換算，可以在css中的body選擇器中宣告Font-size=62.5%，這就使em值變為 16px*62.5%=10px,
  這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數值除以10，然後換上em作為單位就行了。

• ex： 依賴於英文字母小 x 的高度

• ch： 數字 0 的寬度

• rem： rem是CSS3新增的一個相對字型長度單位 。相對

  根元素（html）的 font-size

• vw： 主要在移動端。viewpoint width，視窗寬度，1vw=視窗寬度的1%。

• vh： 主要在移動端。viewpoint height，視窗高度，1vh=視窗高度的1%。

• vmin： vw和vh中較小的那個。（IE不支援）

• vmax： vw和vh中較大的那個。（IE不支援）

• %： 相對於當前物件內的文字尺寸。