CSS-Referenz

Hinweis: Durch Klicken auf eine der CSS-Eigenschaften werden zusätzliche Informationen zur entsprechenden CSS-Eigenschaft angezeigt!

CSS-Eigenschaft Beschreibung
animation: Shorthand-Property zur Definition von Animationen
animation-delay: Verzögerung einer Animation
animation-direction: Reihenfolge einer Animation
animation-duration: Dauer einer Animation
animation-fill-mode: Definiert, ob das animierte Element vor einer Animation den ersten Zustand einnehmen und/oder nach der Animation den letzten Zustand beibehalten soll
animation-iteration-count: Anzahl an Wiederholungen einer Animation
animation-name: Verweis auf eine „@keyframes“-Regel
animation-timing-function: Art und Weise (Funktion) des Animationsverlaufs
background: Shorthand-Property zum Setzen von Hintergrundfarbe und -bilder von Elementen
background-attachement: Verhalten von Hintergrundbildern beim Scrollen
background-color: Hintergrundfarbe von Elementen
background-image: Verwenden von Bildern als Hintergrund von Elemente
background-position: Position von Hintergrundbildern von Elementen
background-repeat: Art der Wiederholung der Hintergrundbilder von Elementen
background-size: Größe von Hintergrundbildern von Elementen
border: Shorthand-Property zur Definition von Rahmeneigenschaften
border-color: Rahmenfarbe von Element-Rahmen
border-collapse: Rahmen einer Tabelle und seiner Tabellenfelder ineinander oder getrennt
border-image: Shorthand-Property zur Definition von Rahmen die aus Bildern bestehen
border-image-outset: Definiert wie weit Rahmen-Bilder aus dem Rahmen herausragen sollen
border-image-repeat: Behandlung der Bildausschnitte an den Rahmenkanten
border-image-slice: Schnittbreite beim Zuschneiden eines Bildes für die Verwendung als Rahmen
border-image-source: Pfad zur Bild-Datei für Rahmen die aus Bildern bestehen
border-image-width: Rahmenbreite bei Rahmen die aus Bildern bestehen
border-radius: Abgerundete Element-Rahmen
border-style: Rahmenstil von Element-Rahmen
border-width: Rahmendicke von Element-Rahmen
bottom: Abstand unten
box-shadow: Schatten für Elemente
box-sizing: Definiert, ob sich die Abmessungen nur auf den Inhalt oder auf Inhalt, Innenabstand und Rahmen beziehen sollen
caption-side: Position des Tabellennamen (erstellt mit dem „caption“-Element)
clear: Normalen Elementfluss wieder herstellen
clip: Anzeigen von Bildausschnitten
color: Textfarbe
column-count: Anzahl an Spalten für ein Element
column-gap: Abstand zwischen den Spalten
column-rule: Shorthand-Property zur Definition von Begrenzungslinien zwischen Spalten
column-span: Anzahl an Spalten, über die ein Element dargestellt werden soll
column-width: Definiert, wie breit eine Spalte mindestens sein muss
counter-increment: Hochsetzen eines Zählers für die automatische Nummerierung
counter-reset: Zurücksetzen eines Zählers für die automatische Nummerierung
cursor: Definition der Form des Cursors über einem Element
display: Art und Weise wie Elemente angezeigt werden
float: Anordnen von Elementen auf der rechten oder linken Seite des Container-Elements (nachfolgende Elemente werden drum herum angeordnet)
font: Shorthand-Property zum Setzen aller Schrifteigenschaften
font-family: Setzen von Schrifttyp und Schriftart
font-size: Schriftgröße
font-style: Schriftstil
font-variant: Schriftvariante
font-weight: Schriftstärke
height: Höhe von Elementen
left: Abstand links
letter-spacing: Abstand zwischen den Zeichen
line-height: Abstand zwischen den Zeilen
list-style: Shorthand-Property zum Setzen der Eigenschaften von Aufzählungszeichen von Listen
list-style-image: Verwenden von Bildern als Aufzählungszeichen von Listen
list-style-position: Aufzählungszeichen innerhalb oder außerhalb des Textbereichs von Listen
list-style-type: Setzen der Aufzählungszeichen von Listen
margin: Shorthand-Property zur Definition des Abstand eines Elements zu benachbarten Elementen bzw. zum Rand des sichtbaren Bereichs des Browsers
margin-bottom: Definition des unteren Außenabstands
margin-left: Definition des linken Außenabstands
margin-right: Definition des rechten Außenabstands
margin-top: Definition des oberen Außenabstands
max-height: Maximale Höhe von Elementen
max-width: Maximale Breite von Elementen
min-height: Minimale Höhe von Elementen
min-width: Minimale Breite von Elementen
opacity: Transparenz für HTML-Elemente
outline: Shorthand-Property zur Definition von Umrandungen
outline-color: Farbe der Umrandung
outline-offset: Abstand der Umrandung zum Rahmen
outline-style: Stil der Umrandung
outline-width: Breite der Umrandung
overflow: Behandlung des überstehenden Inhalts von Elementen
overflow-x: Behandlung des horizontal überstehenden Inhalts von Elementen
overflow-y: Behandlung des vertikal überstehenden Inhalts von Elementen
padding: Shorthand-Property zur Definition des Abstands zwischen Inhalt und Rahmen
padding-bottom: Definition des unteren Abstands zwischen Inhalt und Rahmen
padding-left: Definition des linken Abstands zwischen Inhalt und Rahmen
padding-right: Definition des rechten Abstands zwischen Inhalt und Rahmen
padding-top: Definition des oberen Abstands zwischen Inhalt und Rahmen
position: Art und Weise, wie Elemente positioniert werden
right: Abstand rechts
text-align: Horizontalen Ausrichtung von Elementen
text-decoration: Text unterstreichen, durchstreichen oder überstreichen
text-indent: Erste Zeile eines Absatzes einrücken
text-shadow: Schatten für Text
text-transform: Groß-/Kleinschreibung von Text
top: Abstand oben
transform: Elemente in ihrer Form und Position verändern
transition: Shorthand-Property zur Definition von Übergangen von Eigenschaften
transition-delay: Verzögerung eines Übergangs von Eigenschaften
transition-duration: Dauer eines Übergangs von Eigenschaften
transition-property: Eigenschaft für die ein Übergang definiert werden soll
transition-timing-function: Art und Weise (Funktion) eines Übergangs von Eigenschaften
vertical-align: Vertikale Ausrichtung von Elementen
Vertikale Ausrichtung von Text in Tabellenfeldern
visibility: Anzeigen oder Verstecken von Elementen
white-space: Zeilenumbruch unterbinden
width: Breite von Elementen
word-spacing: Breite des Leerzeichens
z-index: Darstellungsreihenfolge bei überlappenden Elementen
Kombinator Beschreibung
Leerzeichen Unterelement (egal welche Ebene)
> Unmittelbares Unterelement (nur eine Ebene darunter)
~ Geschwisterelement (Element im selben Container-Element)
+ Unmittelbares Geschwisterelement (Benachbartes Element im selben Container-Element)
Pseudo-Klasse Beschreibung
:active Pseudo-Klasse zur Gestaltung von Elementen die angeklickt werden
:checked Pseudo-Klasse zur Gestaltung von aktivierten Checkboxen oder Radio-Button
:disabled Pseudo-Klasse zur Gestaltung von deaktivierten Checkboxen oder Radio-Button
:empty Pseudo-Klasse zur Gestaltung von Elementen mit leerem Inhalt
:enabled Pseudo-Klasse zur Gestaltung von anklickbaren Checkboxen oder Radio-Button
:first-child Pseudo-Klasse zur Gestaltung des ersten Kindelements (egal welchen Typs)
:first-of-type Pseudo-Klasse zur Gestaltung des ersten Kindelements des entsprechenden Typs
:focus Pseudo-Klasse zur Gestaltung von Elementen die den Fokus haben
:hover Pseudo-Klasse zur Gestaltung von Elementen, über denen sich der Mauszeiger befindet
:in-range Pseudo-Klasse zur Gestaltung von numerischen „input“-Elementen, bei denen der Wertebereich eingehalten wurde
:invalid Pseudo-Klasse zur Gestaltung von Eingabefeldern mit ungültigem Inhalt
:last-child Pseudo-Klasse zur Gestaltung des letzten Kindelements (egal welchen Typs)
:last-of-type Pseudo-Klasse zur Gestaltung des letzten Kindelements des entsprechenden Typs
:link Pseudo-Klasse zur Gestaltung von unbesuchten Links
:nth-child() Pseudo-Klasse zur Gestaltung des n-ten Kindelements (egal welchen Typs)
:nth-of-type() Pseudo-Klasse zur Gestaltung des n-ten Kindelements des entsprechenden Typs
:only-of-type Pseudo-Klasse zur Gestaltung von Elementen die das einzigste Unterelement des entsprechenden Typs sind
:out-of-range Pseudo-Klasse zur Gestaltung von numerischen „input“-Elementen, bei denen der Wertebereich nicht eingehalten wurde
:target Pseudo-Klasse zur Gestaltung von Elementen auf die ein Verweis mit einem Link aktiviert wird
:valid Pseudo-Klasse zur Gestaltung von Eingabefeldern mit gültigem Inhalt
:visited Pseudo-Klasse zur Gestaltung von besuchten Links
Pseudo-Element Beschreibung
::after Pseudo-Element zum Einfügen von Inhalt nach einem Element
::before Pseudo-Element zum Einfügen von Inhalt vor einem Element
::first-letter Pseudo-Element zur Gestaltung des ersten Buchstaben in einem Element
::first-line Pseudo-Element zur Gestaltung der ersten Zeile in einem Element
::selection Pseudo-Element zur Gestaltung von markierten Elementen (z. B. mit dem Cursor markierter Text)
@-Regel Beschreibung
@font-face Verwendung von nicht vorinstallierten Schriftarten
@keyframes Definition von mehrstufigen Übergängen (Animationen)
@media CSS-Deklarationen in Abhängigkeit von Medientypen (Endgeräte-Typen) und Medienmerkmalen (Darstellungs-Charakteristika)