疑似要素 (Pseudo-elements)

概要

疑似クラスと同じく、疑似要素 (Pseudo-elements) はセレクタに追加して記述するものですが、:after の様な、特別な状態を記述するだけのものではありません。疑似要素は、ドキュメントの特定のパーツをスタイル付けします。例えば ::first-line 疑似要素は、セレクタで指定された要素の最初の行だけを対象にします。

構文

selector:pseudo-element {
  property: value;
}

すべての疑似要素

• ::after
• ::before
• ::first-letter
• ::first-line
• ::selection
• ::backdrop

補足

時々、1 個のコロン (:) ではなく、2 個のコロン (::) が使用されることがあります。これは、CSS3 の一部であり、疑似クラスと疑似要素の区別を明確にしようとするためのものです。多くのブラウザは両方の値をサポートしています。

疑似要素はセレクタに 1 個だけ使用することができます。ステートメント内のシンプルセレクタの後に現れます。