分類

line-height | スタイルシートリファレンス

CSSのline-heightプロパティは行ボックスの高さ、つまり1行あたりの高さを設定するプロパティです。

line-heightプロパティで設定する値は

で意味合いが少し異なります。

[ブロックレベル要素]
ブロックレベル要素に含まれる行ボックスの高さの最小値を設定します。

[インライン要素]
行ボックスの高さを計算するための値を設定。

normalが設定可能です。normalはその設定値をブラウザに依存します。

line-height: 1.5;やline-height: 2;など単位のない値を設定可能です。

この場合、「単位のない値の数値 x フォントサイズ」の計算結果が利用されます。

pxやremなど長さの単位を使った指定方法です。それぞれその単位の長さが適用されます。

要素のフォントサイズの相対値となります。font-size: 14pxでline-height: 100%であれば、14pxが適用されます。

line-height: 高さの値;

上記のサンプルコードではline-heightプロパティの設定で

などパターン別に設定した例です。

CSSのline-heightプロパティはモダンなブラウザのほぼ全てで対応しているプロパティです。line-heightプロパティの各ブラウザ毎の対応状況を確認したい方は下記よりご確認頂けます。