CSS 2.1 ::Vollreferenz

CSS 2.1: Die Selektoren

Allgemeines:

Jedes Element innerhalb eines Webdokuments steht in einem genau definierten Verhältnis zu seinem Kontext. Mit Hilfe von Selektoren lassen sich nun Elemente allein nach ihrer Stellung auswählen (=selektieren), die sie gegenüber anderen Elementen einnehmen (Kind-, Geschwister- oder Nachfahren- Selektor). Dabei können wir immer nur zur Seite (Geschwister) oder nach unten (Nachfahren) deklarieren. Es gibt keine Selektoren, die Eltern oder Vorfahren eines Elements auswählen.

Eine genauere Erklärung über die Verhältnisse von HTML-Elementen zueinander findet sich im Beitrag über den Dokumentstammbaum. Auf dieser Seite wollen wir uns damit befassen, wie wir mit Hilfe der Selektoren auf diese Elemente eines Webdokuments zugreifen können.

Elemente lassen sich aber nicht nur über ihre Stellung innerhalb des Dokuments selektieren, sondern auch nach ihren Attributen (ID, Klassen- und Attributselektor). Die allgemeinste Selektion ist durch Universal- und Typselektor möglich.

Musterabgleich (pattern matching)

Der Musterabgleich hat den Zweck, die durch einen Selektor definierten Bedingungen daraufhin zu prüfen, ob sie mit einem Element des Webdokuments zusammenpassen. Diese Bedingungen bestehen aus Einfach- Selektoren und Kombinatoren des Selektors und deren Zusammensetzung. So bedingt z. B. das Pseudoelement :first-child eine Einschränkung auf das erste Kindelement und eine Kombination 'DIV P' gilt nur für Absätze P, die Nachkommenelement eines DIV-Containers sind. Nur auf Elemente des Webdokuments, die diese Bedingungen erfüllen, werden die dazu gehörigen Deklarationen angebracht.

Gruppierung

Gelegentlich möchte man für mehrere Selektoren dieselbe Deklaration verwenden. Damit nun nicht die gleiche Regel mehrfach notiert werden muß, verwendet man die Technik der Gruppierung. Dabei werden die betreffenden Selektoren, durch Kommata getrennt, hintereinander eingetragen.

Aus:

h1 { ... }
h2 { ... }
h3 { ... }
h4 { ... }

Wird dann:

h1,h2,h3,h4 { ... }

Auf diese Weise werden mehrere Regeln zu einer Regel zusammengefaßt, deren Deklarationen für alle notierten Selektoren gelten.

Liste der Selektoren

Eigenschaft

CSS 2.1

CSS Mobile

Attributselektor (attribute)5.8 —
ID-Selektor (id)5.9Selectors
Kindselektor (child)5.6Selectors
Klassenselektor (class)5.8.3Selectors
Nachbarselektor (adjacent sibling)5.7 —
Nachfahrenselektor (descendant)5.5Selectors
Typselektor (element/type)5.4Selectors
Universalselektor (universal)5.3Selectors

Home|Vollreferenz|Schnellreferenz|Grundlegendes|Tutorials & Artikel|Quiz|Allgemeines

Die URL dieser Seite ist: www.thestyleworks.de/ref/index_se.shtml
Gedruckt am Montag, dem 24. November, 2014.
© Copyright All Contents 2002- 2014 K. Langenberg.
Commercial Use prohibited.


Notizen: