CSS/Selektoren/Pseudoklasse/not

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Pseudoklasse :not() erwartet als Argument einen einfachen Selektor, mit Ausnahme der Pseudoklasse :not() selbst. Sie spricht dann alle diejenigen Elemente an, auf die das Argument nicht zutrifft.

  • CSS 3.0
  • IE 9
  • Firefox
  • Chrome
  • Safari
  • Opera
Beispiel ansehen …
<!doctype html> <html> <head> <meta charset="utf-8"> <title>CSS-Beispiel: Pseudoklasse :not()</title> <style> a:not([href*="example."]) { background: red; } </style> </head> <body> <h1>Die Pseudoklasse :not()</h1> <ul> <li><a href="http://example.com/">Beispiellink</a></li> <li><a href="http://example.com/example.pdf">ein PDF-Dokument</a></li> <li><a href="http://wiki.selfhtml.org/">Das selfhtml wiki</a></li> <li><a href="HTTPS://EXAMPLE.ORG/WIKI/EXAMPLE.PDF/">Groß- und Kleinschreibung beachten!</a></li> </ul> </body> </html>
In diesem Beispiel werden alle Link-Elemente, deren href-Attribut nicht die Zeichenkette „example.“ enthält mit einem roten Hintergrund versehen.
Beispiel
#inhalt :not(p) { color: red }
In diesem Beispiel würden alle Kindelemente des Elementes mit der ID „inhalt“, die keine Absätze sind, eine rote Schriftfarbe erhalten. Dies ist etwa sinnvoll, wenn dieses Element nur Überschriften, Absätze und Bilder enthält.

Änderungen in CSS Level 4[Bearbeiten]

In Level 4 darf das Argument der Pseudoklasse auch ein zusammengesetzter Selektor sein.

siehe auch[Bearbeiten]