Cascading Style Sheets ::Schnellreferenz
CSS 2.1: Selektoren, Pseudoklassen, Pseudoelemente
Eigenschaft | Browser-Support |
| Attributselektor (attribute) |
|
| ID-Selektor (id) |
|
| Kindselektor (child) |
|
| Klassenselektor (class) |
|
| Geschwister- Selektor (adjacent sibling) |
|
| Nachfahrenselektor (descendant) |
|
| Typselektor (element/type) |
|
| Universalselektor (universal) |
|
Eigenschaft | Browser-Support |
| Dynamische Pseudoklassen :active, :focus, :hover |
|
| Link-Pseudoklassen :link, :visited |
|
| Strukturelle Pseudoklasse :first-child |
|
| Sprach-Pseudoklasse :lang(n) |
|
| Druck-Pseudoklassen :first, :left, :right |
|
Eigenschaft | Browser-Support |
| :before, :after |
|
| :first-letter |
|
| :first-line |
Das Pseudo-Element
|
Cascading Style Sheets ::Schnellreferenz
CSS 1 & CSS 2: Selektoren
Die Stylesheet-Schnellreferenz kann auch als PDF-Datei herunter geladen werden.
| Selektor | CSS-Syntax | Bedeutung und Anwendbarkeit | |
|---|---|---|---|
| Selektor | CSS-Syntax | Bedeutung und Anwendbarkeit | |
Hinweis 1: |
|||
Selektoren | |||
E1, E2, E3 { ... } |
Für Elemente E1, E2 und E3 gilt dieselbe Deklaration. |
||
* { ... } |
Gilt für alle Elemente. Das Zeichen * kann auch weggelassen werden. |
||
E1 { ... } |
Gilt nur für das Element E1. |
||
E1 E2 { ... } |
Jedes Element E2, das ein beliebiger Nachkomme eines Elementes E1 ist. |
||
E1 > E2 { ... } |
Jedes Element E2, das ein direkter Nachkomme eines Elementes E1 ist. (Siehe Dokumentstammbaum.) |
||
E1 + E2 { ... } |
Gilt für jedes Element E2, wenn es direkt auf E1 folgt und wenn E1 und E2 dasselbe Elternelement haben. |
||
E [att] { ... } |
Jedes Element E, das ein Attribut att mit einem beliebigen Wert hat 1).HTML-Syntax: <E att="..."> |
||
E [att=val] { ... } |
Jedes Element E, das ein Attribut att mit dem Wert val hat 1).HTML-Syntax: <E att="val"> |
||
E [att~=val1] { ... } |
Jedes Element E, das ein Attribut att mit mehreren Werten hat, von denen einer gleich val1 sein muss 1).HTML-Syntax: <E att="val1 val2 ..."> |
||
E [att|=val1] { ... } |
Jedes Element E, das ein Attribut att hat, dessen Wert entweder exakt gleich val1 ist oder dessen Wert mit der Zeichenkette val1- beginnt 1).HTML-Syntax: <E att="val1"> oder <E att="val1-...">, aber nicht: <E att="val2-..."> |
||
E #id { ... } |
Alle Elemente E mit dem Attribut id 1).HTML-Syntax: <E id="..."> |
||
.class |
Alle Elemente E mit dem Attribut class 1).HTML-Syntax: <E class="..."> |
||
| Selektor | CSS-Syntax | Bedeutung und Anwendbarkeit | |
Pseudoklassen | |||
Pseudoklasse :first-child |
E:first-child { ... } |
Jedes Element E, wenn es das erste Kindelement eines anderen Elements ist. 1) (Siehe Dokumentstammbaum) | |
Link-Pseudoklassen (Gruppierung verboten!) |
E:link { ... } |
Die Deklaration trifft nur auf Elemente E zu, die unbesuchte Hyperlinks sind. :link und :visited dürfen nicht gruppiert werden. 1) |
|
E:visited { ... } |
Die Deklaration trifft nur auf Elemente E zu, die besuchte Hyperlinks sind. :link und :visited dürfen nicht gruppiert werden. 1) |
||
Dynamische Pseudoklassen (Gruppierung möglich) |
E:hover { ... } |
Die Deklaration trifft auf Anker-Elemente zu, über die der Mauszeiger gehalten wird. 1) | |
E:active { ... } |
Die Deklaration trifft auf Anker-Elemente zu, die per Tastendruck oder Mausklick aktiviert worden sind 1) | ||
E:focus { ... } |
Die Deklaration trifft auf Anker-Elemente zu, die durch Druck der Tabulator- oder anderer Tasten in den Fokus gekommen sind. 1) | ||
E:lang(..) { ... } |
Trifft zu auf alle Elemente E, für die die angegebene Sprache im Webdokument definiert ist. 1) |
||
| Selektor | CSS-Syntax | Bedeutung und Anwendbarkeit | |
Pseudoelemente | |||
E:first-line { ... } |
Trifft zu auf die erste Zeile Text innerhalb des Elementes E. 1) |
||
E:first-letter { ... } |
Trifft zu auf das erste Zeichen im Text innerhalb des Elementes E. 1) |
||
E:before { ... } |
Generiert zusätzliche Inhalte vor dem Inhalt des Elements E. 1) |
||
E:after { ... } |
Generiert zusätzliche Inhalte nach dem Inhalt des Elements E 1) |
||
