疑似要素 (Pseudo-elements)

概要

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

構文

selector:pseudo-element {
  property: value;
}

すべての擬似要素

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

補足

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

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