Zum Inhalt springen

background-color

  • Redaktion 
  • Zuletzt aktualisiert am

#background-color

Legt die Farbe des Hintergrunds des Elements fest.

default background-color: transparent;

Standardmäßig ist die Hintergrundfarbe transparent, was bedeutet, dass es keine Hintergrundfarbe gibt.

background-color: red;

Sie können eine der 140+ Farbnamen wählen.

background-color: #05ffb0;

Sie können hexadezimale Farbcodes verwenden.

background-color: rgb(50, 115, 220);

Sie können rgb() Farbcodes verwenden:

  • der erste Wert steht für rot
  • Der zweite Wert steht für grün
  • Der dritte Wert steht für blau

Jeder von ihnen kann einen Wert zwischen 0 und 255 haben.

background-color: rgba(50, 115, 220, 0.3);

Sie können rgba() Farbcodes verwenden:

  • Die ersten 3 Werte sind für rgb
  • der 4. Wert ist für den alpha-Kanal und definiert die Deckkraft der Farbe

Der Alphawert kann von null 0 (transparent) bis eins 1 (undurchsichtig) gehen.

background-color: hsl(14, 100%, 53%);

Sie können hsl() Farbcodes verwenden:

  • Der erste Wert steht für hue und kann von 0 bis 359
  • reichen.

  • Der zweite Wert ist für saturation und geht von 0% bis 100%
  • Der dritte Wert ist für luminosity und geht von 0% bis 100%

background-color: hsla(14, 100%, 53%, 0.6);

Sie können hsl()a Farbcodes verwenden:

  • Die ersten 3 Werte sind für hsl
  • Der 4. Wert ist für den alpha Kanal und definiert die Deckkraft der Farbe

Der Alphawert kann von null 0 (transparent) bis eins 1 (undurchsichtig) gehen.