TIL

Today I Learned. 知ったこと、学んだことを書いていく

行間をあけて読みやすくする - CSS

行間を開けるにはline-heightプロパティを使う。上下にスペースができる

body {
    line-height: 1.8;
}

行間は「フォントサイズ * 指定した値」となる。

line-height: 1.8;では、フォントサイズの1.8倍の行間になる

値としては1.5〜1.8がいいらしい。見出しなどのフォントサイズが大きい要素に対しては、小さい値を設定する

また、line-heightプロパティは継承されるため、body要素に指定しておくといいらしい。

行間って大事!line-height: 7;にしたらめっちゃ見づらくなった...

参考文献