Der Selektor ist der Teil einer CSS-Regel, der bestimmt, für welche Elemente sie gilt. Von seiner Form hängt ab, wie leicht sich die Regel später überschreiben lässt.
- Selektor (CSS)
Der Teil einer CSS-Regel vor dem geschweiften Block, der die Elemente bestimmt, für die die Regel gilt.
Beispiel: „Ein Selektor beschreibt ein Muster, kein einzelnes Element.“Auch: CSS-Selektor.
Die Bausteine
Ein Selektor setzt sich aus einfachen Teilen zusammen: dem Elementnamen, einer Klasse, einer ID, einem Attribut oder einer Pseudoklasse. Zwischen zwei Teilen steht ein Kombinator, der die Beziehung beschreibt.
nav ul > li:first-child a[href^="/"] { … }Flach schlägt lang
Je mehr Teile ein Selektor hat, desto höher seine Spezifität und desto schwerer lässt er sich später überschreiben. Eine einzelne Klasse am Element ist fast immer die haltbarere Wahl, auch wenn sie einen neuen Namen kostet.
Dasselbe gilt für die Leistung, allerdings in kleinerem Maßstab: Browser lesen Selektoren von rechts nach links. Praktisch spürbar wird das erst bei sehr großen Dokumenten.