CSS 単位リファレンス

CSS の長さ単位は 2 種類あります: 物理サイズに固定された絶対単位と、フォント・親・ビューポートに応じてスケールする相対単位。レスポンシブデザインでは主に相対単位を使います — 特に rem、%、ビューポート単位。

更新 2026-07-06

絶対単位

単位	意味
px	ピクセル — 画面の基本単位。1px は 1 デバイス非依存ピクセル。
pt	ポイント — 1/72 インチ。印刷用スタイルシートで一般的。
in	インチ — 1in = 96px = 2.54cm。
cm	センチメートル — 主に印刷用。
mm	ミリメートル — 主に印刷用。
pc	パイカ — 1pc = 12pt = 1/6 インチ。まれ。

単位	意味
%	親要素の対応する値に対する百分率。
em	要素自身のフォントサイズに相対的。1.5em = フォントサイズの 1.5 倍。
rem	ルート（html）のフォントサイズに相対的。一貫したスケーリングに予測可能。
ex	現在のフォントの x-ハイト（ほぼ使われない）。
ch	現在のフォントの '0' 文字の幅。
vw	ビューポート幅の 1%。
vh	ビューポート高さの 1%。
vmin	ビューポートの小さい方の寸法（幅または高さ）の 1%。
vmax	ビューポートの大きい方の寸法の 1%。
fr	CSS グリッドコンテナの空き領域の一部。

どちらもフォントサイズに応じてスケールしますが、em は現在の要素のフォントサイズに相対的なので入れ子の要素を通じて累積し、rem は常にルートのフォントサイズに相対的なのでどれだけ深く入れ子でも予測可能です。迷ったら、サイズや余白には rem が最も驚きが少ないです。