【CSS】最初の１行だけ【セレクター】

最初の一行にだけスタイルを当てるCSSセレクター「first-line」があります。

例えば以下のようなHTMLがあったとして、

<p>
  この文章はダミーです。<br>
  文字の大きさ、量、字間、行間等を<br>
  確認するために入れています。
</p>

これを最初の一行「この文章はダミーです。」のテキストにだけCSSを適用させることができます。

CSSがこちら⬇

p::first-line {
    font-weight: bold;
}

疑似要素の::first-lineを使って最初の一行にだけスタイルを当てることができます。

あくまで最初の１行のみなので、画面を狭くして改行されてしまった場合、折り返した先の文字にはスタイルが適用されませんのでご注意を。