CSS-background-Eigenschaft

Definition und Verwendung

background Kurzschreibweise einer Eigenschaft, um alle Hintergrundattribute in einer Deklaration zu setzen.

Es können folgende Eigenschaften eingestellt werden:

Wenn einer der Werte nicht eingestellt wird, gibt es kein Problem, zum Beispiel background:#ff0000 url('smiley.gif'); ist auch erlaubt.

Es wird in der Regel empfohlen, diese Eigenschaft zu verwenden, anstatt einzelne Attribute zu verwenden, da diese Eigenschaft in älteren Browsern besser unterstützt wird und weniger Buchstaben eingeben müssen.

Weitere Informationen finden Sie unter:

CSS-Tutorial:CSS Hintergrund,CSS Hintergrund (fortgeschritten)

HTML DOM Referenzhandbuch:background-Eigenschaft

Beispiel

Wie man alle Background-Attribute in einer Deklaration einstellt:

body
  { 
  background: #00FF00 url(bgimage.gif) no-repeat fixed top;
  }

Versuchen Sie es selbst

CSS-Syntax

background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;

Eigenschaftswert

Wert Beschreibung CSS
background-color Es wird vorgeschrieben, die zu verwendende Hintergrundfarbe. 1
background-position Es wird vorgeschrieben, die Position des Hintergrundbildes. 1
background-size Es wird vorgeschrieben, die Größe des Hintergrundbildes. 3
background-repeat Es wird vorgeschrieben, wie das Hintergrundbild wiederholt wird. 1
background-origin Es wird vorgeschrieben, den Bereich der Positionierung des Hintergrundbildes. 3
background-clip Es wird vorgeschrieben, den Bereich der Zeichnung des Hintergrundes. 3
background-attachment Es wird vorgeschrieben, ob das Hintergrundbild fest oder mit dem Rest der Seite verschoben wird. 1
background-image Es wird vorgeschrieben, das zu verwendende Hintergrundbild. 1
inherit Es wird vorgeschrieben, dass die Einstellungen der background-Eigenschaft des Elternelements übernommen werden sollten. 1

Technische Details

Standardwert: nicht spezifiziert
Vererbbarkeit: nein
Version: CSS1 + CSS3
JavaScript-Syntax: object.style.background="weiß url(paper.gif) repeat-y"

Browser-Unterstützung

Die in der Tabelle genannten Versionen der Browser zeigen die erste Version, die die Eigenschaft vollständig unterstützt.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5