The StyleWorksCSS { Referenz · Labor · Übungen }
  1. Startseite
  2. Referenz
  3. Schnellreferenz
  4. Farb- und Hintergrund-Eigenschaften

Schnellreferenz · CSS 2.1

Schnellreferenz Farb- und Hintergrund-Eigenschaften

Alle Eigenschaften des Kapitels in Tabellenform: mögliche Werte, Ausgangswert, Vererbung, Anwendbarkeit, Bezugswert für Prozentangaben und Mediengruppe – und die Browser-Unterstützung mit ihren Einschränkungen.

Erstveröffentlichung Vollreferenz alle Eigenschaften

Was in diesem Kapitel steht

Kapitel 14 fasst die Vordergrundfarbe und die fünf Hintergrund-Eigenschaften zusammen: Farbe, Bild, Wiederholung, Verankerung und Position, dazu die Kurzform, die alle fünf auf einmal setzt. Es ist eines der kürzesten Kapitel der Spezifikation und zugleich eines der meistgenutzten.

Die Vererbungsspalte trennt es sauber: Die Vordergrundfarbe wird vererbt, jede Hintergrundangabe nicht. Das ist Absicht – eine geerbte Hintergrundfarbe würde jedes Kind übermalen und die Schichtung unmöglich machen, während eine geerbte Textfarbe genau das tut, was man erwartet. Beim Bezugswert für Prozentangaben ist nur die Position aufgeführt: Dort meint der Prozentwert nicht einen Abstand von der Kante, sondern die Ausrichtung eines Punktes im Bild auf denselben Punkt in der Box.

Browser-Unterstützung

EigenschaftBrowser-Support
color
IE/Win 5.x, IE/Win 6, IE 7
IE/Win akzeptiert innerhalb der Farbbezeichnungen nach SVG-1.0 Grautöne nur mit der Bezeichnung '...gray...', nicht in der Schreibweise '...grey...'.
Konqueror 3.5
Konqueror erkennt innerhalb der Farbbezeichnungen nach SVG-1.0 auch Grautöne in der Schreibweise '...grey...'. Ausnahme: der Wert grey selbst wird wie silver interpretiert.

background
IE/Win 5.x, IE/Win 6, IE 7
MS IE/Win bis Version 7 hat einzelne Probleme, die bei den entsprechenden background- Eigenschaften erläutert sind.

background-attachment
IE/Win 5.x, IE/Win 6
IE/Win interpretiert den Wert fixed nur am Element body korrekt, Abhilfe per JavaScript ist aber möglich. Ferner ignoriert er den Wert inherit.
IE 7
IE 7 erkennt den Wert fixed korrekt, ignoriert aber den Wert inherit.
Opera 7.x
Opera bis Version 7 ignoriert den Wert inherit. Von Version 8 an wird der Wert erkannt.

background-color
IE/Win 5.x, IE/Win 6, IE 7
IE/Win ignoriert den Wert inherit. Innerhalb der Farbbezeichnungen nach SVG-1.0 akzeptiert IE/Win Grautöne nur mit der Bezeichnung '...gray...', nicht in der Schreibweise '...grey...'.
Konqueror 3.5
Konqueror erkennt innerhalb der Farbbezeichnungen nach SVG-1.0 auch Grautöne in der Schreibweise '...grey...'. Ausnahme: der Wert grey selbst wird wie silver interpretiert.

background-image
IE/Win 5.x, IE/Win 6, IE 7
IE/Win ignoriert den Wert inherit.

background-position
IE/Win 5.x, IE/Win 6, IE 7
IE/Win behandelt den Wert inherit wie den Doppelwert 'top left'.
Für Inline-Level-Elemente mit Zeilenumbruch stellt IE/Win die Werte left und right falsch dar. In dem Fall bewirkt der Wert left, dass eine Hintergrund- Graphik nicht am Anfang des deklarierten Elements erscheint, sondern an dem Punkt, der physikalisch am weitesten links liegt, d. h. nach dem Zeilenumbruch. Dasselbe gilt analog umgekehrt für den rechten Rand.

background-repeat
IE/Win 5.x, IE/Win 6, IE 7
IE/Win interpretiert den Wert inherit wie den Wert repeat.

Schnellreferenz-Tabelle

Cascading Style Sheets ::Schnellreferenz

CSS 1 & CSS 2: Farb- und Hintergrund-Eigenschaften

Die Stylesheet-Schnellreferenz kann auch als PDF-Datei herunter geladen werden.

Eigenschaft Mögliche
Werte		 Ausgangs-
wert		 Vererbung Anwend-
barkeit		 %-Bezugs-
wert		 Medien-
gruppe
Eigenschaft Mögliche
Werte		 Ausgangs-
wert		 Vererbung Anwend-
barkeit		 %-Bezugs-
wert		 Medien-
gruppe

color
Farbnamen
#rrggbb
#rgb
rgb(rr%,gg%,bb%)
rgb(rrr,ggg,bbb)
transparent
inherit
 Abhängig vom
Anwender-
programm		 Ja Alle Elemente Nicht zutreffend Visual
background
-color
Farbnamen
#rrggbb
#rgb
rgb(rr%,gg%,bb%)
rgb(rrr,ggg,bbb)
transparent
inherit
 transparent Nein Alle Elemente Nicht zutreffend Visual
background
-image
url()
none
inherit
 none Nein Alle Elemente Nicht zutreffend Visual
background
-repeat
repeat
no-repeat
repeat-x
repeat-y
inherit
 repeat Nein Alle Elemente Nicht zutreffend Visual
background
-attachment
scroll
fixed
inherit
 scroll Nein Alle Elemente Nicht zutreffend Visual
background
-position
Längenwerte
Prozentangabe
top center bottom
left center right
inherit
 0% 0% Nein Alle Elemente Box des zugehörigen Elementes Visual
background (Kurzschrift)
Eigenschaften
inherit
 Siehe Einzel- eigen- schaften Nein Alle Elemente Nur erlaubt für background- position Visual