CSS-Syntax


Inhaltsverzeichnis

    Inhaltsverzeichnis anzeigen


Eine CSS-Regel besteht aus einem Selektor und einem Deklarationsblock.


CSS-Syntax

Der Selektor zeigt auf das HTML-Element, das Sie formatieren möchten.

Der Deklarationsblock enthält eine oder mehrere durch getrennte Deklarationen Semikolons.

Jede Deklaration enthält einen CSS-Eigenschaftsnamen und einen Wert, getrennt durch einen Doppelpunkt.

Mehrere CSS-Deklarationen werden durch Semikolon und Deklaration getrennt Blöcke werden von geschweiften Klammern umgeben.

Beispiel

In diesem Beispiel werden alle <p>-Elemente mittig ausgerichtet und rot markiert Textfarbe:

p
{
  color: red;
  text-align: center;
}

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
  text-align: center;
} 
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>


Beispiel erklärt

  • p ist ein Selektor in CSS (er zeigt auf das HTML-Element, das Sie formatieren möchten: <p>).

  • color ist eine Eigenschaft und red ist der Eigenschaftswert

  • text-align ist eine Eigenschaft und center ist der Eigenschaftswert

In den nächsten Kapiteln erfahren Sie noch viel mehr über CSS-Selektoren und CSS-Eigenschaften!