CSS單位

單位 含義
em 相對於父元素的字體大小,若父元素font-size爲16px,那麼1em就爲16px
ex 相對於小寫字母"x"的高度
gd 一般用在東亞字體排版上,這個與英文並無關係
rem 相對於根元素字體大小,若根元素font-size爲16px,那麼1em就爲16px
vw 相對於視窗的寬度:視窗寬度是100vw
vh 相對於視窗的高度:視窗高度是100vh
vm 相對於視窗的寬度或高度,取決於哪個更小
ch 1ch的大小和字母o的寬度相等
px 相對於屏幕分辨率而不是視窗大小:通常爲1個點或1/72英寸
in inch, 表英寸
cm centimeter, 表釐米
mm millimeter, 表毫米
pt 磅,1/72英寸,絕對長度單位
pc 12點活字,或1/12點,絕對長度單位
% 相對於父元素。正常情況下是通過屬性定義自身或其他元素

1in = 2.54cm = 25.4 mm = 72pt = 6pc

單位 含義
deg degrees, 角度,一個圓360度
grad grads, 梯度,一個圓400梯度
rad  radians, 弧度,一個圓2π弧度
turn turns, 圈數,一個圓共一圈
ms milliseconds, 毫秒數
seconds, 秒數
Hz    Hertz, 赫茲
kHz kilohertz, 千赫

90deg = 100grad = 0.25turn ≈ 1.570796326794897rad 

 vw,vh,vm:

爲css3新單位。
所提到的視窗:“視區”所指爲瀏覽器內部的可視區域大小,即window.innerWidth/window.innerHeight大小,不包含任務欄標題欄以及底部工具欄的瀏覽器區域大小。
可用來做響應式佈局。如設置寬度爲20vw,高度爲40vh,表示當前元素在任何屏幕下都是div佔當前屏幕寬度的20%,當前高度的40%。但兼容性不好,使用並不廣泛。
ex:

ex單位被定義爲”當前字體的x-height或者一個em的一半”。給定的字體的x-height是指那個字體的小寫x的高度。通常,這是這個字體的中間的標誌。

ch:

給定一個等寬字體的字體,一個N個字符單位寬的盒子,比如width:40ch;,可以一直容納一個有40個字符的應用那個特定字體的字符串。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章