CSS Grundlagen: Web-Design mit Background – Erfahre, wie du deine Seite attraktiver gestalten kannst

English

Hintergrund definieren: CSS Eigenschaft Background

Die CSS-Eigenschaft background ist die Kurzschreibweise für die CSS-Eigenschaften

CSS-Eigenschaft: Background

Beschreibung mögliche Werte Standardwert Kategorie
Hintergrund Hintergrundfarbe
background-image
background-repeat
background-position
background-attachment
inherit
Farben
Hintergrundfarbe

Die Angabe in oranger Schrift ist die Standardanwendung der CSS-Eigenschaft background

Hintergrundfarbe definieren

Den Hintergrund kann man in CSS auf unterschiedliche Weise definieren:

  1. mit dem Hex-Code der Farbe #RRGGBB
    Dies ist die Standard-Methode, um Farben in CSS zu definieren.

    Der Farb-Code beginnt mit dem Rautezeichen #, gefolgt von 6 Hex-Ziffern. Die Farb-Anteile für Rot, Grün und Blau werden jeweils mit zwei Hex-Ziffern (0 bis F) angegeben. Beispiel: Der Farb-Code #DAA520 bezeichnet die Farbe     .

  2. mit dem Hex-Code der Farbe mit Transparenz #RRGGBBAA
    Der Hex-Code unter 1. kann durch zwei weitere Ziffern erweitert werden. Dadurch kann man die Deckkraft (Englisch: Opacity) der Farbe definieren. Der Wert für die Deckkraft muss zwischen 00 und FF liegen.

    • 00 bedeutet 0% Deckkraft, also volle Transparenz

    • FF bedeutet 100% Deckkraft, also überhaupt keine Transparenz.

    Beispiel: Der Farb-Code #DAA520B2 (etwa 70% Deckkraft) bezeichnet die Farbe     .

  3. mit einem HTML Farbnamen (z.B. LightGrey bzw. LightGray).

  4. /* Hintergrund der Seite */
    body {
      font-family: "Noto Sans", "Open Sans", Verdana, Arial, sans-serif;
      /* GhostWhite */
      background: #f8f8ff;
    
      /* DarkSlateGrey */
      color: #2f4f4f;
    
      /* Standard Schriftgröße */
      font-size: 1em;
    }