ユニバーサル セレクター (*) を使用して、:before や :after などの疑似要素のスタイルを設定できますか?

ユニバーサル セレクターと擬似要素

ユニバーサル セレクター (*) は、ドキュメント内のすべての要素を対象とします。ただし、:before や :after のような疑似要素には直接影響しません。

疑似要素は、仮想ノードを表す DOM の抽象化です。これらは実際の要素ではないため、 *.

のような単純なセレクターの対象にすることはできません。疑似要素にスタイルを適用するには、それらをセレクターに明示的に含める必要があります (例: 、)。 before, *:after.

これは、宣言 * { box-sizing: border-box; を意味します。

代わりに、:before、:after { box-sizing: border-box; } は、:before や :after のような疑似要素に自動的には影響しません。

一部の開発者は * { box-sizing: border-box; だけを使用する場合があります。通常、疑似要素はインラインで表示されるため、問題が発生することはありません。ボックスのサイズ変更はインライン要素に影響を与えないため、ユニバーサル セレクターを単独で使用しても、疑似要素に顕著な影響を与えることはありません。

:before、:after は疑似要素に影響を与えることに注意することが重要です。 html、head、body を含むすべての要素のうち、これらの疑似要素は content プロパティを適用するまで生成されません。この動作に関連するパフォーマンスの問題はありません。

以上がユニバーサル セレクター (*) を使用して、:before や :after などの疑似要素のスタイルを設定できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。