:not()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Die :not() CSS Pseudoklasse repräsentiert Elemente, die nicht mit einer Liste von Selektoren übereinstimmen. Da sie verhindert, dass bestimmte Elemente ausgewählt werden, ist sie als Negations-Pseudoklasse bekannt.
Probieren Sie es aus
p:not(.irrelevant) {
font-weight: bold;
}
p > strong,
p > b.important {
color: crimson;
}
p > :not(strong, b.important) {
color: darkmagenta;
}
Mars is one of the most Earth-like planets. Mars day is almost
the same as an Earth day, only 37 minutes longer.
NASA's Jet Momentum Propulsion Laboratory
is designing mission concepts to survive the Venus extreme temperatures
and atmospheric pressure.
Die :not() Pseudoklasse hat einige Eigenheiten, Tricks und unerwartete Ergebnisse, die Sie kennen sollten, bevor Sie sie verwenden.
Syntax
Die :not() Pseudoklasse benötigt als Argument eine Selektorliste, eine durch Kommas getrennte Liste von einem oder mehreren Selektoren. Die Liste darf kein Pseudoelement enthalten, aber alle anderen einfachen, zusammengesetzten und komplexen Selektoren sind erlaubt.
:not() {
/* ... */
}
Beschreibung
Bei der Verwendung von :not() gibt es mehrere ungewöhnliche Effekte und Ergebnisse, die Sie beachten sollten:
- Sinnlose Selektoren können unter Verwendung dieser Pseudoklasse geschrieben werden. Zum Beispiel stimmt
:not(*)mit jedem Element überein, das kein Element ist, was offensichtlich Unsinn ist, daher wird die zugehörige Regel niemals angewendet werden. - Diese Pseudoklasse kann die Spezifität einer Regel erhöhen. Zum Beispiel wird
#foo:not(#bar)dasselbe Element wie der einfachere#fooselektieren, hat aber die höhere Spezifität von zweiidSelektoren. - Die Spezifität der
:not()Pseudoklasse wird durch die Spezifität des spezifischsten Selektors in ihrem durch Kommas getrennten Argument ersetzt; es bietet die gleiche Spezifität, als wenn es geschrieben worden wäre als:not(:is(argument)). :not(.foo)wird alles selektieren, das nicht.fooist, einschließlichund.- Dieser Selektor wird alles selektieren, das "kein X" ist. Dies kann überraschend sein, wenn er mit Nachfahrenkombinatoren verwendet wird, da es mehrere Wege gibt, ein Ziel-Element zu selektieren. Zum Beispiel wird
body :not(table) atrotzdem auf Links innerhalb eines