CSS - Hintergrundeigenschaft
Beispiel
Legen Sie verschiedene Hintergrundeigenschaften in einer Deklaration fest:
body
{
background: lightblue url("img_tree.gif") no-repeat fixed center;
}
Definition und Verwendung
Die background
Eigenschaft ist eine abgekürzte Eigenschaft für:
- Hintergrundfarbe
- Hintergrundbild
- Hintergrund-Position
- Hintergrundgröße
- Hintergrund Wiederholung
- Hintergrund-Herkunft
- Hintergrund-Clip
- Hintergrund-Anhang
Es spielt keine Rolle, ob einer der obigen Werte fehlt, zB background:#ff0000 url(smiley.gif); ist erlaubt.
Standardwert: | siehe einzelne Eigenschaften |
---|---|
Vererbt: | Nein |
Animierbar: | Ja, siehe einzelne Eigenschaften . Lesen Sie mehr über animierbare |
Ausführung: | CSS1 + neue Eigenschaften in CSS3 |
JavaScript-Syntax: | object .style.background="rote URL (smiley.gif) oben links ohne Wiederholung" |
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die die Eigenschaft vollständig unterstützt.
Property | |||||
---|---|---|---|---|---|
background | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Hinweis: Siehe individuelle Browserunterstützung für jeden Wert unten.
CSS-Syntax
background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
Hinweis: Wenn eine der Eigenschaften in der Kurzschriftdeklaration die Eigenschaft bg-size ist, müssen Sie sie mit einem / (Schrägstrich) von der Eigenschaft bg-position trennen, z. B. background:url(smiley.gif) 10px 20px/50px 50px ; ergibt ein Hintergrundbild, das 10 Pixel von links und 20 Pixel von oben positioniert ist, und die Größe des Bildes ist 50 Pixel breit und 50 Pixel hoch.
Hinweis: Wenn Sie mehrere Hintergrundbildquellen verwenden, aber auch eine Hintergrundfarbe wünschen, muss der Parameter für die Hintergrundfarbe an letzter Stelle in der Liste stehen.
Eigenschaftswerte
Value | Description | CSS |
---|---|---|
background-color | Specifies the background color to be used | 1 |
background-image | Specifies ONE or MORE background images to be used | 1 |
background-position | Specifies the position of the background images | 1 |
background-size | Specifies the size of the background images | 3 |
background-repeat | Specifies how to repeat the background images | 1 |
background-origin | Specifies the positioning area of the background images | 3 |
background-clip | Specifies the painting area of the background images | 3 |
background-attachment | Specifies whether the background images are fixed or scrolls with the rest of the page | 1 |
initial | Sets this property to its default value. Read about initial | 3 |
inherit | Inherits this property from its parent element. Read about inherit | 2 |
Verwandte Seiten
CSS-Tutorial: CSS-Hintergrund , CSS-Hintergründe (Fortgeschrittene)
HTML-DOM-Referenz: Hintergrundeigenschaft