CSS-Referenz

Nutzen Sie diese CSS-Referenz, um ein alphabetisches Verzeichnis aller standardmäßigen CSS-Eigenschaften, Pseudoklassen, Pseudoelemente, Datentypen, funktionalen Notationen und at-rules zu durchsuchen. Sie können zudem wichtige CSS-Konzepte und eine Liste von Selektoren nach Typ organisiert durchstöbern. Ebenfalls enthalten ist eine kurze DOM-CSS / CSSOM-Referenz.

Grundlegende Regel-Syntax

Stilregel-Syntax

style-rule ::=
    selectors-list {
      properties-list
    }

Wo:

selectors-list ::=
    selector[:pseudo-class] [::pseudo-element]
    [, selectors-list]

properties-list ::=
    [property : value] [; properties-list]

Sehen Sie sich das Verzeichnis von Selektoren, Pseudoklassen und Pseudoelementen unten an. Die Syntax für jeden spezifizierten Wert hängt vom für jede spezifizierte Eigenschaft definierten Datentyp ab.

Beispiele für Stilregeln

css

strong {
  color: red;
}

div.menu-bar li:hover > ul {
  display: block;
}

Für eine Einführung auf Anfängerniveau in die Syntax von Selektoren sehen Sie unseren Leitfaden zu CSS-Selektoren. Beachten Sie, dass jeder Syntax-Fehler in einer Regeldefinition die gesamte Regel ungültig macht. Ungültige Regeln werden vom Browser ignoriert. Beachten Sie, dass CSS-Regeldefinitionen vollständig (in Unicode) textbasiert sind, während DOM-CSS / CSSOM (das Regelverwaltungssystem) objektbasiert ist.

At-rule-Syntax

Da die Struktur von at-rules stark variieren kann, finden Sie die Syntax der spezifischen, die Sie suchen, unter At-rule.

Index

Hinweis: Dieser Index enthält keine SVG-exklusiven Präsentationsattribute, die als CSS-Eigenschaften auf SVG-Elementen verwendet werden können.

Hinweis: Die Eigenschaftsnamen in diesem Index enthalten nicht die JavaScript-Namen, die sich von den CSS-Standardnamen unterscheiden.

-

A

B

C

D

E

F

G

H

I

J

K

L

M

N

O

P

Q

R

S

T

U

V

W

X

x
:xr-overlay
xywh()

Y

Z

Selektoren

Die folgenden sind die verschiedenen Selektoren, die es ermöglichen, dass Stile bedingt basierend auf verschiedenen Merkmalen von Elementen innerhalb des DOM angewendet werden.

Grundlegende Selektoren

Grundlegende Selektoren sind fundamentale Selektoren; dies sind die grundlegendsten Selektoren, die häufig kombiniert werden, um andere, komplexere Selektoren zu erstellen.

Universalselektor *
Typselektor elementname
Klassenselektor .classname
ID-Selektor #idname
Attributselektor [attr=value]

Gruppen-Selektoren

Selektorliste A, B: Gibt an, dass sowohl A als auch B Elemente ausgewählt sind. Dies ist eine Gruppierungsmethode, um mehrere übereinstimmende Elemente auszuwählen.

Kombinatoren

Kombinatoren sind Selektoren, die eine Beziehung zwischen zwei oder mehr einfachen Selektoren herstellen, wie „A ist ein Kind von B“ oder „A grenzt an B“, und damit einen komplexen Selektor erzeugen.

Nachbarschaftsskombinator A + B: Gibt an, dass die von beiden A und B ausgewählten Elemente denselben Elternteil haben und dass das von B ausgewählte Element dem von A ausgewählten Element direkt auf horizontaler Ebene folgt.
Subsequent-Sibling-Kombinator A ~ B: Gibt an, dass die von beiden A und B ausgewählten Elemente denselben Elternteil haben und dass das von A ausgewählte Element vor—aber nicht unbedingt direkt vor—dem von B ausgewählten Element kommt.
Kindkombinator A > B: Gibt an, dass das von B ausgewählte Element das direkte Kind des von A ausgewählten Elements ist.
Nachfahrenkombinator A B: Gibt an, dass das von B ausgewählte Element ein Nachkomme des von A ausgewählten Elements ist, aber nicht unbedingt ein direktes Kind.
Spaltenkombinator A || B Experimentell: Gibt an, dass das von B ausgewählte Element innerhalb der von A angegebenen Tabellenspalte liegt. Elemente, die sich über mehrere Spalten erstrecken, werden als Mitglied all dieser Spalten betrachtet.

Pseudo

Pseudoklassen :: Gibt einen speziellen Zustand der ausgewählten Elemente an.
Pseudoelemente ::: Repräsentiert Entitäten, die nicht in HTML enthalten sind.

Siehe auch Selektoren in der Selektoren-Spezifikation und die Pseudoelemente-Spezifikation.

Mozilla-CSS-Erweiterungen (mit der Vorsilbe -moz-)
WebKit-CSS-Erweiterungen (meistens mit der Vorsilbe -webkit-)

Externe Links

CSS-Indizes (w3.org)

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden