幅や高さを表す単位

CSSでは、幅や高さを表す単位に相対指定と絶対指定の2つのグループがあります。 絶対指定とは、直接大きさを指定する単位で、相対指定とは、基準に対する比率で指定する単位です。

プロパティのとりうる値が<length>となっているものは、符合と数値、単位で幅や高さを指定します。 符号のデフォルトは、プラスで単位の指定は、数値が0でない場合必須になります。

相対指定

• em : font-size(フォントの大きさ)を1とした単位。font-size自身に指定する場合は、親要素のfont-sizeを1とします。
• ex : x-height(小文字の高さ)を1とした単位。
• px : ピクセル。1インチあたりに表示できるピクセル数によって決まります。

フォントの大きさに px 単位を使う場合、ブラウザの設定でフォントの大きさが変更できなくなります。 読みやすい文字の大きさを、十分考慮して指定する必要があります。

絶対指定

• in : インチ(1in=2.54cm)。
• cm : センチメートル。
• mm : ミリメートル。
• pt : ポイント(1pt=1/72in)。
• pc : パイカ(1pc=12pt)。

in指定の場合、96dpiのモニタでは96pxと同じ物理サイズになります。 同じモニタ解像度の場合でも、OSの解像度が72dpiと96dpiの場合では、in指定に対する 物理的サイズが異なります。

%(パーセント)

プロパティのとりうる値が<percentage>となっているものは、符合と数値、%で指定します。

パーセント指定では、元になる値を100%として相対的に値が決定します。

次の例では、line-heightはfont-sizeを基準にするため12ptになります。

p {
    font-size: 10pt;
    line-height: 120%
}