Die Syntax

In CSS beschreibe ich, wie jedes Element aussieht und wie diese Elemente zusammen ein Layout bilden. Im Gegensatz zu HTML, das nur für die logische Formatierung zuständig ist, übernimmt CSS die physische Formatierung. CSS ist eng mit HTML verbunden, da es immer die von HTML erstellten Elemente verwenden wird, um sie zu formatieren.

Die CSS-Syntax wird auf einem Selektor, einer Eigenschaft und einem Wert spielen.

1. Der Selektor
   Er bezieht sich auf das HTML-Element und definiert, welches Element wir stilisieren, entweder eine Überschrift (h1), einen Link (a) oder den gesamten Abschnitt (section), etc
2. Die Eigenschaft
   Sie definiert, welchen Aspekt wir stilisieren, entweder die Farbe (color), den Hintergrund (background), die Breite (width), die Textgröße (font-size), etc
3. Der Wert
   wird den Wert der Eigenschaft festlegen, entweder rot (red), 45px, rechts (right), oben (top), usw.

Wie schreibt man das wirklich in CSS?

Der Selektor wird immer gefolgt vom Öffnen und Schließen der geschweiften Klammer {}.

Selektor { }

Die Deklaration wird immer innerhalb der geschweiften Klammern stehen, und um die Eigenschaft vom Wert zu trennen, werden wir den Doppelpunkt : verwenden.

Selektor { Eigenschaft: Wert }

Man kann mehrere Erklärungen hintereinander abgeben und jede wird mit einem Semikolon ; abgeschlossen, um Platz für die nächste zu schaffen.
/!\ Vorsicht, wenn Sie das Semikolon vergessen, kann das ganze Blatt verbuggt sein.

Selektor {
    Eigenschaft: Wert;
    Eigenschaft: Wert;
    Eigenschaft: Wert;
 }

Hier ein konkreteres Beispiel: Ich möchte meinen h1 mit der Textfarbe Rot (red) und einer Textgröße (font-size) von 45px haben.

h1 {
    color: red;
    font-size: 45px;
}