CSS Background Kurzform

CSS background - Kurzformattribut

Um den Code zu verkürzen, können Sie auch alle Background-Eigenschaften in einer Eigenschaft angeben. Dies wird als Kurzformattribut bezeichnet.

statt so zu schreiben:

body {
  background-color: #ffffff;
  background-image: url("tree.png");
  background-repeat: no-repeat;
  background-position: right top;
}

Sie können das Kurzformattribut verwenden background:

Beispiel

Setzen Sie die Background-Attribute in einer Kurzform in einer Deklaration:

body {
  background: #ffffff url("tree.png") no-repeat right top;
}

Probieren Sie es selbst aus

Bei der Verwendung des Kurzformattributs ist die Reihenfolge der Werte:

  • background-color
  • background-image
  • background-repeat
  • background-attachment
  • background-position

Fehlt einer der Werte, ist das nicht schlimm, solange die anderen Werte in dieser Reihenfolge gesetzt werden. Beachten Sie, dass wir im obigen Beispiel das background-attachment-Attribut nicht verwendet haben, da es keinen Wert hat.

Alle CSS-Background-Eigenschaften

Eigenschaft Beschreibung
background Kurzformattribut, um alle Background-Attribute in einer Deklaration zu setzen.
background-attachment Stellt fest, ob das Hintergrundbild fest ist oder zusammen mit dem Rest der Seite scrollt.
background-clip Bestimmt den Bereich, in dem die Hintergrundzeichnung erfolgt.
background-color Setzt die Hintergrundfarbe des Elements.
background-image Setzt das Hintergrundbild des Elements.
background-origin Bestimmt, wo das Hintergrundbild platziert wird.
background-position Position des Hintergrundbildes festlegen.
background-repeat Bestimmen Sie, ob und wie das Hintergrundbild wiederholt wird.
background-size Größe der Hintergrundbilder definieren.