CSS/Lengths and Units

< CSS

為指定寬度、高度或其他長度,可用的度量單位有:

CSS的度量單位
Code 定義 註釋
em 元素的字體的高度
ex 元素的字體的字母'x'的高度
px 像素
mm 毫米
cm 厘米
pt point (1/72 英寸)
pc pica (12 points, 即1/6英寸)
in 英寸

長度也可表示為另一個長度的百分比。這可能使情況複雜化,因為基線長度隨着屬性的不同而不同。例如,用屬性margin計算百分比是基於包含塊的寬度。用屬性font-size計算百分比,是基於父元素的font-size。而用屬性line-height計算百分比,是基於當前元素的font-size

屏幕上的字體尺寸最好基於百分比或以em為度量單位。這意味着頁面將跟着用戶字體選擇而變化。用像素(px)為單位指定字體尺寸會導致一些問題,應該儘量避免。

絕對度量單位mm, cm, pt, pc, in在屏幕上工作不好,在很多老瀏覽器上會引發問題。這些用在打印時更安全。但即使打印,使用這些度量單位也與用戶的選擇難以交互。

相對度量單位 編輯

3個度量單位:em, ex, px是相對度量單位。並不指出一個固定長度。而是隨其他量的變化而變。對於emex,隨某些元素的字體尺寸變化而變。

屏幕像素, 打印機像素和CSS像素 編輯

px單位指出CSS像素長度。它不同於屏幕像素, 打印機像素。

計算 編輯