line-height
CSSの書き方
line-height:値 ;
CSSの詳細情報 | |||||
---|---|---|---|---|---|
プロパティ名 | line-height | 読み方 | ライン・ハイト | ||
初期値 | normal | 意味 | 行間調節 | ||
値 | サイズ指定/パーセント指定 | ||||
対象 | すべての要素 | ||||
CSSレベル | CSSレベル1 | 対応ブラウザ | Windows | MAC | |
継承 | する | IE 5.0以上/FF1.0/NS7.1/OP8.0 | SF/IE5.0 |
解説
行間を調節するスタイルシートです。
サイズまたはパーセントによる指定が可能です。
サイズ(数値)による指定
「14px」などサイズ(数値)で指定した場合は、そのサイズが行の高さとなります。
実際に表示されている文字がこの指定した数値より小さい場合は、行間が空き、逆に大きい場合には、行と行が重なり合って表示されます。
パーセント(相対的な数値)による指定
パーセントなど相対的な数値で行間を指定した場合、基準となる長さは「line-height」プロパティを指定した要素の文字の大きさです。
例えば、スタイルシートを設定しない状態で、文字が10ピクセルで表示された文章に150%の行間を与えた場合、行間は「10×(150-100)÷100」で、5ピクセルの間隔が空くことになります。
従って、パーセントで指定した場合の初期値は「100%」になります。
CSS/HTMLサンプル
p.line { line-height:150%; }
段落要素の文字列の行間をクラス指定で文字サイズの50%にする サンプル