HTML5權威指南——CSS的長度

gyypwrs發表於2020-10-23
HTMLCSS

CSS的長度分為兩種，相對的和絕對的。相對的肯定就是有參照物的，在參照物的基礎上放縮。但奇怪的是px是相對長度。

絕對長度

絕對長度就是現實世界的度量單位，為列印文件設計樣式可以使用這種單位。

單位識別符號說明
in英寸
cm釐米
mm毫米
pt磅(1/72英寸)
pcpica（1pica等於12磅）

相對長度

單位識別符號說明
em與元素字號掛鉤
ex與元素字型的“x高度”掛鉤
rem與根元素的字號掛鉤
pxcss畫素
%另一個屬性值的百分比

例如：
2em就是當前font-size的兩倍。
1ex一般就是當前字母x的高度，1ex=0.5em。
rem則是根據根元素（html元素）的字號來計算，若根元素的字號為0.2in那麼2rem即為0.4in。
px不必多說。
%需要注意的是並非所有屬性都可用%，還有一個與%掛鉤的其他屬性值並非完全相同，如font-size掛鉤的是繼承到的font-size，而width則是元素包含塊的寬度。

相關文章