前書き
擬似クラスは擬似クラスと同じようにCSSセレクタに追加されますが、特別な状態を記述するのではなく、html要素の特定の部分をスコープしてスタイル設定することができます。
たとえば、:: first-letter擬似要素は、セレクタで指定されたブロック要素の最初の文字のみを対象とします。
構文
- selector :: pseudo-element {プロパティ：値}
パラメーター
| 擬似要素 | 説明 |
|---|---|
::after | 要素の内容の後に内容を挿入する |
::before | 要素の内容の前に内容を挿入する |
::first-letter | 各要素の最初の文字を選択します。 |
::first-line | 各要素の最初の行を選択します。 |
::selection | ユーザーが選択した要素の部分と一致します。 |
::backdrop | 最上位レイヤーのスタック内の要素の基礎となるドキュメントを隠す背景を作成するために使用されます |
::placeholder | フォーム要素のプレースホルダテキストをスタイルすることができます（実験的） |
::marker | 特定の要素にリストスタイルの属性を適用する場合（実験的） |
::spelling-error | ブラウザが間違って綴られたテキストセグメントを表します（実験的）。 |
::grammar-error | ブラウザが文法的に正しくないと判断したテキストセグメントを表します（実験的）。 |
備考
時にはあなたは、二重のコロン（表示されます
::（）の代わりに、1つだけ:）。これは、擬似要素から擬似クラスを分離する方法ですが、Internet Explorer 8のような一部の古いブラウザでは、単一のコロンをサポートしています（:疑似要素のため）。セレクタでは1つの擬似要素しか使用できません。ステートメント内の単純なセレクタの後に表示する必要があります。
疑似要素はDOMの一部ではないため、
:hoverやその他のユーザーイベントによってターゲティングすることはできません。
擬似要素 関連する例
This modified text is an extract of the original Stack Overflow Documentation created by following contributors and released under CC BY-SA 3.0
This website is not affiliated with Stack Overflow
Email: tutorialpedia@outlook.com