Values and Units(計量單位介紹) | CSS

CSS 計量單位分為絕對單位和相對單位，許多人因為使用錯誤的單位，常常導致在RWD(響應式)中畫面發生顯示元素錯誤

CSS 計量單位，例如百分比、像素和 em 單位。學會如何使用這些工具才能精確控制佈局、大小和間距。無論你是設計愛好者還是CSS 初心者，掌握 CSS 絕對單位和相對單位將使你能夠打造完美的RWD(響應式)網站。

CSS 絕對單位

單位 名稱 等價換算
cm 公分(centimeters) 1cm = 37.8px = 25.2/64in
mm 毫米(millimeter) 1mm = 1/10th of 1cm
in 英吋(Inches) 1in = 2.54cm = 96px
pc 派卡(Picas) 1pc = 1/6th of 1in
pt 點數(Points) 1pt = 1/72nd of 1in
px 像素(Pixels) 1px = 1/96th of 1in

CSS 相對單位

html 默認的font-size是16px

符號 說明
% 針對父元素
em 針對父元素的font-size
rem 針對根元素的font-size
vw 針對視窗寬度的1%
vh 針對視窗高度的1%