HTML5權威指南——CSS的長度

gyypwrs發表於2020-10-23

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則是元素包含塊的寬度。

相關文章