CSS ::first-letterで最初の1文字目にCSSを適用する

環境
Google Chrome　109.0.5414.120
Windows 10 Home 64bit

構文
セレクタ::first-letter{
}
「::first-letter」を使って最初の1文字目にCSSを適用します。

使用例

<!DOCTYPE html>
<html>
<head>
<style>
  .pA::first-letter {
    color: red;
  }
  </style>
</head>
<body>

<p class="pA">
  tokyo1-1<br />
  oosaka1-2
</p>
</body>
</html>

結果
最初の1文字目「t」の色が赤になります。

CSS

Posted by arkgame