CSS単位変換ツール

CSS単位の使い分けガイド

CSSには多くの単位があり、用途によって使い分けることが重要です。

絶対単位

• px — ピクセル。画面上の最小表示単位。固定サイズの指定に使用
• pt — ポイント（1pt = 1/72インチ）。印刷用CSSで使用

相対単位

• rem — ルート要素のfont-size基準（デフォルト16px）。最も推奨される相対単位
• em — 親要素のfont-size基準。ネストすると累乗的に変化するため注意
• % — 親要素のサイズ基準。widthやheightで使用
• vw/vh — ビューポート幅/高さの1%。フルスクリーンレイアウトに便利

62.5%テクニック

html { font-size: 62.5%; } と設定すると、1rem = 10pxになり計算が楽になります。14px = 1.4rem、20px = 2remのように直感的に換算できます。