line-height

解説

行の高さを指定する際に使用します(マイナス値は指定不可)。正確には行のベースラインから次の行のベースラインまでの距離となります。行の高さとフォントサイズの指定方法により、行が重なって表示されるので注意が必要となります。

プロパティ情報

値:長さ、パーセンテージ、数値、normal
初期値:normal
適用対象:全ての要素
継承:する
パーセンテージ:要素自信の文字の高さ
適用メディア:視覚
レベル:1〜2

参照

使用例

ソース

CSSの記述方法はスタイルシートってなに?も参照下さい。

div.sample1 {line-height: normal;}
div.sample2 {line-height: 12px;}
div.sample3 {line-height: 2;}
div.sample4 {line-height: 120%;}
HTMLの記述方法

<div class="sample1"><p>サンプル1行目<br>サンプル2行目</p></div>
<div class="sample2"><p>サンプル1行目<br>サンプル2行目</p></div>
<div class="sample3"><p>サンプル1行目<br>サンプル2行目</p></div>
<div class="sample4"><p>サンプル1行目<br>サンプル2行目</p></div>

表示結果

サンプル1行目
サンプル2行目

サンプル1行目
サンプル2行目

サンプル1行目
サンプル2行目

サンプル1行目
サンプル2行目