Zielt CSS „:not()' selektiv nur auf unmittelbare Nachkommen ab?-CSS-Tutorial-php.cn

Zielt CSS „:not()' selektiv nur auf unmittelbare Nachkommen ab?

Patricia Arquette

Freigeben： 2024-12-03 05:26:10

Original

792 Leute haben es durchsucht

Does CSS `:not()` Selectively Target Only Immediate Descendants?

Ist der CSS :not()-Selektor für entfernte Nachkommen gedacht?

Die CSS3 :not()-Pseudoklasse, wie in beschrieben Die offizielle Dokumentation unter http://www.w3.org/TR/css3-selectors/#negation ist darauf ausgelegt, Elemente abzugleichen, die nicht mit einem bestimmten übereinstimmen Selektor. Benutzer haben jedoch festgestellt, dass die Funktionalität bei der Verwendung mit entfernten Nachkommen eingeschränkt ist.

Betrachten Sie das Beispiel:

div :not(p) { color: red; }

Nach dem Login kopieren

Während dieser Selektor funktioniert, wenn

ein direktes untergeordnetes Element von

ist, schlägt es fehl, wenn

ist ein weiter entfernter Nachkomme. Dieses Verhalten ist beabsichtigt, da :not() nur die unmittelbaren Nachkommen des Zielelements negiert.

In dem Fall, in dem

ein
enthält, ist es das
selbst, der mit *:not(p) übereinstimmt und den Stil erbt. Das
Das Element selbst zählt immer noch gegen die Negation und erbt die Textfarbe von seinem übergeordneten Element.

Um diese Einschränkung zu überwinden, kann die Ausrichtung auf
Elemente direkt wird empfohlen:
p { color: black; }
Nach dem Login kopieren
Selektoren Level 4 schlägt vor, :not() zu erweitern, um vollständig komplexe Selektoren zu akzeptieren, die Kombinatoren enthalten, was ein spezifischeres Nachkommen-Targeting ermöglicht. Diese Funktion befindet sich jedoch noch in der Implementierungsphase.
Das obige ist der detaillierte Inhalt vonZielt CSS „:not()' selektiv nur auf unmittelbare Nachkommen ab?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!