構文

line-height : 高さ;

説明文

　「line-height」は，1行の高さを設定する。例えば，行間を設け文書を読みやすくする事ができる。

　行の高さは，前行の文字の下部から次行の文字の上部の間隔を指定する。例えば，フォントのサイズが10ptで，line-heightに18ptを指定すると前行との間隔が4pt，次行との間隔が4pt設けられる。

　値の指定には以下のような単位を利用することが可能となる。

単位意味
inインチ（1インチ=25.4mm）
cmセンチ・メートル
mmミリ・メートル
ptポイント（72ポイント=1インチ）
pcパイカ（1パイカ=12ポイント）
pxディスプレイの表示に利用する画素（ピクセル）
em要素で指定されているフォントのサイズを基準とした倍数。例えば，12ptのサイズを指定している要素に2emを指定すると，倍の24ptとなる
ex要素で指定されている小文字フォントのサイズを基準とした倍数
%親要素を基準とした割合

　また，<p>タグや<div>タグでpaddingやmarginが指定されている場合に，ブロック要素同士の間隔は，margin，paddingにline-heightの間隔を足し合わせた値となる。

[画像のクリックで拡大表示]

使用例

● CSSの定義

p { line-height : 2em; }

● HTMLの例

<p>文書が折り返して複数行にわたって表示される場合，「line-height」は行間
を指定できる。行間を設け文書を読みやすくする事ができる。行間は上と下の行
の間隔で指定する。</p>

● 表示結果

Internet Explorerの表示例
[画像のクリックで拡大表示]
Firefoxの表示例
[画像のクリックで拡大表示]

関連項目