Beeinflusst der Universal Selector (*) Pseudoelemente wie :before und :after?

Universeller Selektor (*) und Pseudoelemente (:before, :after)

Erweitert der universelle Selektor (*) seinen Einfluss? zu Pseudoelementen wie :before und :after? Zum Beispiel bei der Verwendung von:

* { box-sizing: border-box; }

Wirkt es sich automatisch auf Pseudoelemente aus oder ist es notwendig, explizit zu deklarieren:

*, *:before, *:after { box-sizing: border-box; }

Entgegen der Intuition hat der universelle Selektor keinen direkten Einfluss Pseudoelemente (abgesehen von der indirekten Vererbung). Dies liegt daran, dass :before und :after von tatsächlichen Elementen getrennte Entitäten sind und durch Abstraktionen dargestellt werden.

Einfache Selektoren wie * können nur auf tatsächliche Elemente abzielen, nicht auf Pseudoelemente. Um :before und :after zu formatieren, müssen Sie sie explizit in Ihren Selektor einschließen.

Der Grund dafür, dass bei Ihnen möglicherweise keine Probleme aufgetreten sind, obwohl Sie nur * verwendet haben, kann sein, dass Pseudoelemente standardmäßig die Inline-Anzeige verwenden, was nicht betroffen ist nach Boxgröße.

Denken Sie daran, dass bei der Verwendung mehrerer einfacher Selektoren das Einschließen von * aus Gründen der Übersichtlichkeit optional ist. Während die aktuelle Selectors-Spezifikation außerdem Doppelpunkte zur Kennzeichnung von Pseudoelementen verwendet, unterstützen ältere Browser die Einzelpunkt-Notation für das Zurücksetzen der Boxgröße.

Obwohl :before, :after Stile auf anwendet Pseudoelemente aller Elemente werden erst generiert, wenn Sie die Content-Eigenschaft deklarieren. Dies stellt keine Leistungsbedenken dar.

Das obige ist der detaillierte Inhalt vonBeeinflusst der Universal Selector (*) Pseudoelemente wie :before und :after?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!