CSS 2.1: `background-repeat`

Erläuterungen

Die Eigenschaft background-repeat ist ein Teil der Kurzschrift- Eigenschaft background. Mit ihr wird, ausgehend vom definierten Ursprung der Hintergrundzeichnung, die Wiederholungsrichtung der Grafik bestimmt. Die Grafiken werden ohne Zwischenraum direkt aneiander gefügt. Die Ausgabe der Wiederholung ist dabei auf die Fläche des Inhaltes und die padding-Fläche der zugehörigen Inline- Box oder Block- Box begrenzt.

Alle Hintergrundeigenschaften unterlegen die Fläche des Inhalts eines Elements, die padding-Fläche und die durch den Rahmen eines Elementes belegte Fläche.

Erlaubte Werte

Auszug aus der Spezifikation (die verwendete Syntax wird im Artikel CSS-Wertesyntax genauer erläutert):

'background-repeat' repeat | repeat-x | repeat-y | no-repeat | inherit

Funktionsdiagramm der Eigenschaft 'background-repeat'.

repeat (Ausgangswert): Das Hintergrundbild wird vom Ursprung aus horizontal und vertikal elementfüllend wiederholt.
repeat-x: Das Hintergrundbild wird vom Ursprung aus horizontal in beide Richtungen (rechts und links) elementfüllend wiederholt (mathematische x-Richtung).
repeat-y: Das Hintergrundbild wird vom Ursprung aus vertikal in beide Richtungen (oben und unten) elementfüllend wiederholt (mathematische y-Richtung).
no-repeat: Das Hintergrundbild wird nur im Ursprung einmal dargestellt und nicht wiederholt.
inherit: Bestimmt explizit, dass diese Eigenschaft denselben berechneten Wert wie im Elternelement annimmt.

Code-Beispiel:

BODY {background-repeat: repeat-y;}

Browserunterstützung

Die Eigenschaft background-repeat wird von allen modernen Browsern unterstützt, mit folgenden Einschränkungen:

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

Eric Meyer's CSS2 Test Suite zeigt am praktischen Beispiel, wie die Browser mit dieser Eigenschaft umgehen.

Keine Eigenschaft und kein Selektor stehen in einem Stylesheet für sich allein. In der Praxis kann das Zusammenspiel zwischen verschiedenen Elementen und Selektoren einen nicht zu unterschätzenden Einfluss auf die Fähigkeiten der Browser haben. Bugs treten oft erst durch das Zusammenwirken mehrerer Eigenschaften an unterschiedlichen Elementen auf.

Wechselwirkungen:

background, background-attachment, background-color, background-image, background-position

Besonderheiten im Medientyp `handheld`:

Diese Eigenschaft ist Teil des Standards CSS Mobile Profile 1.0 und unterliegt damit auch in Mobilgeräten allen relevanten Regeln aus CSS 2.1. Hintergrundeigenschaften werden von den meisten Mobilgeräten nicht dargestellt und es muss auch aufgrund der eingeschränkten Farbwiedergabe von der Verwendung dieser Eigenschaften in Stylesheets für handheld abgeraten werden.