擬似要素（Pseudo-element）は、CSSで特定の要素の一部にスタイルを適用したい場合に使う機能です。通常の要素全体ではなく、その一部（たとえば最初の文字や特定の部分）を対象にする際に便利です。

擬似要素は、セレクタにコロン（::）を使って指定し、特定の部分に対してスタイルを設定します。

主な擬似要素の種類

::before

指定した要素の内容の前に内容を追加します。
主に content プロパティを使用して、アイコンやテキストを挿入するために使います。

p::before {
  content: "★ ";
  color: gold;
}

::after

指定した要素の内容の後に内容を追加します。
::beforeと同様に content プロパティを使います。

p::after {
  content: " ☆";
  color: gold;
}

::first-line

要素の最初の行だけにスタイルを適用します。
フォントや色など、特定のスタイルのみが適用できます。

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

::first-letter

要素の最初の文字にスタイルを適用します。
大文字やフォントサイズの調整に使われることが多いです。

p::first-letter {
  font-size: 2em;
  color: red;
}

擬似要素と擬似クラスの違い

擬似要素は、要素内部の特定の部分（文字や行など）に対してスタイルを適用します。通常は「::」を使いますが、旧バージョンのCSSでは:（コロン1つ）も使用されることがあります。

擬似クラスは、要素全体の特定の状態にスタイルを適用します（例えば:hoverや:active）。