px ⇄ rem 換算

在 px、rem、em、pt、vw、vh 之間互相換算，可自定義根字號、父字號與視口尺寸，一次看全所有單位。

數值

輸入單位

換算前提

根字號（rem）

父字號（em）

視口寬度（vw）

視口高度（vh）

換算結果

rem 相對根元素 html 的字號，瀏覽器預設 16px；改了根字號，整站的 rem 會一起縮放，這是它比 px 更適合響應式的根本原因。

em 相對**父元素**的字號，會隨著巢狀層層累乘——三層巢狀裡寫 0.8em，實際就是 0.8³。這是 em 最容易出問題的地方，能不用就不用。

vw / vh 相對視口，1vw 是視口寬度的 1%。注意移動端瀏覽器位址列收起時視口高度會變，用 100vh 做全屏容易出現內容被截，現在更推薦 dvh。

pt 是印刷單位（1/72 英寸），CSS 裡 1pt = 4/3 px。螢幕上的字號建議直接用 px 或 rem。