length

CSSプロパティの値として、lengthが使える時があります。

本ページでは、lengthで使える数値と単位を説明します。

lengthとは

lengthは、長さを示します。数値と単位を合わせて指定します。

数値は整数、小数点などが扱えます。また、マイナスが使えるプロパティもあります。

単位は、相対的な単位と絶対的な単位があります。

以下は、使える単位の例です。

【lengthで使える単位(例)】
区分	単位	説明
相対的	em	対象となる要素のフォントサイズを1とします。
相対的	rem	ルート要素(html要素)のフォントサイズを1とします。
相対的	ex	対象となる要素の小文字x(x-height)サイズを1とします。
絶対的	in	1インチ(2.54cm)を1とします。
絶対的	cm	1cm(センチメートル)を1とします。
絶対的	mm	1mm(ミリメートル)を1とします。
絶対的	pt	1ポイント(1/72インチ)を1とします。
絶対的	pc	1パイカ(1/6インチ)を1とします。
絶対的	px	1ピクセルを1とします。

emの利用例は、以下のとおりです。

【emの利用例】

font-size: 0.9em;

上記により、現在のフォントサイズから0.9倍を指定したことになります。例えば、現在のフォントサイズが16pxだった場合は、14.4px(= 16 × 0.9)になります。

font-sizeでemを使用すると、継承によって親要素の影響を受けます。例えば、親要素で0.9emが指定されていると、0.81倍(= 0.9 × 0.9)になります。

pxの利用例は、以下のとおりです。

【pxの利用例】

font-size: 16px;

上記により、現在のフォントサイズが何であっても16pxになります。これは、親要素からの継承の影響を受けません。