jubilee

Programing, Books and more...

[CSS] 文字の高さを指定する

font-sizeで指定した文字の大きさに対し、上下にどれくらいの余裕を持たせるかを指定するline-heightの指定のしかた。
このline-heightプロパティの値はpxではなく、文字サイズに対する割合で指定する。

(font-size + 上余白 + 下余白) / font-size = line-heightの値(小数点4位切り上げ)

例えば、
文字サイズ16pxで上下に3pxずつ余裕をもたせる場合
(16 + 3 + 3) / 16 = 1.375

文字サイズ14pxで上下に3pxずつ余裕をもたせる場合
(14 + 3 + 3) / 14 = 1.42857… –> 1.429