各種單位的探討
CSS 單位 參考整理表
絕對式單位
單位 | 說明 | CSS3 |
---|---|---|
px | 像素 |
相對式單位
單位 | 說明 | CSS3 |
---|---|---|
em | 相對於父層字體大小的倍數。 例如: 父層是24px, 子層設定 2em = 24px*2 = 48px。 |
|
rem | 相對於 html 字體大小的倍數 (相當於瀏覽器的整體預設,預設是16px)。 例如: 設定 2rem = 16px*2 = 32px。 |
V |
vw | viewpoint width, 相對於視窗寬度的百分比,例如: 設定 1vw = 視窗寬度的 1%。 | V |
vh | viewpoint height, 相對於視窗高度的百分比,例如: 設定 1vh = 視窗高度的 1%。 | V |
vmin | vw 和 vh 中較小的那個。 | V |
vmax | vw 和 vh 中較大的那個。 | V |
% | 相對父層的百分比例。 |