CSS 單位參考
CSS 長度單位分兩類：固定於物理尺寸的絕對單位，以及隨字型、父元素或視區縮放的相對單位。做響應式設計時你主要用相對單位 —— 尤其是 rem、% 和視區單位。
更新 2026-07-06
絕對單位
| 單位 | 含義 |
|---|---|
| px | 像素 —— 螢幕的基本單位。1px 是一個裝置無關像素。 |
| pt | 點 —— 1/72 英吋。常見於列印樣式表。 |
| in | 英吋 —— 1in = 96px = 2.54cm。 |
| cm | 公分 —— 主要用於列印。 |
| mm | 公釐 —— 主要用於列印。 |
| pc | 派卡 —— 1pc = 12pt = 1/6 英吋。少見。 |
相對單位
| 單位 | 含義 |
|---|---|
| % | 相對父元素對應值的百分比。 |
| em | 相對元素自身的字級。1.5em = 字級的 1.5 倍。 |
| rem | 相對根（html）字級。對一致縮放可預測。 |
| ex | 目前字型的 x 高度（很少使用）。 |
| ch | 目前字型中 '0' 字元的寬度。 |
| vw | 視區寬度的 1%。 |
| vh | 視區高度的 1%。 |
| vmin | 視區較小維度（寬或高）的 1%。 |
| vmax | 視區較大維度的 1%。 |
| fr | CSS 格線容器中可用空間的一份。 |
em 與 rem：關鍵區別
兩者都隨字級縮放，但 em 相對目前元素的字級（所以會在巢狀元素中累積），而 rem 始終相對根字級（所以無論巢狀多深都可預測）。拿不準時，尺寸和間距用 rem 最少意外。
相關工具