Inline-Stile

Jetzt bist du dran und schreibst selbst CSS. Wir haben die Seite wieder in den Zustand ohne Stylesheet versetzt. Es gibt drei Möglichkeiten, CSS in eine Seite einzufügen, und in dieser Lektion probierst du alle aus.

Die erste Möglichkeit ist, die Stile direkt in ein Element zu schreiben, in sein Attribut style. Man nennt sie Inline-Stile:

<p style="color: orange">CSS lernen!</p>

Dieser Absatz sieht so aus:

CSS lernen!

Der Text color: orange ist eine Deklaration. Sie besteht aus zwei Teilen, die ein Doppelpunkt trennt:

• Die Eigenschaft sagt, was du ändern willst, hier color, die Farbe des Textes.
• Der Wert sagt, worauf du es änderst, hier orange.

CSS kennt die Namen vieler Farben, etwa red, blue, green oder orange. Die anderen Schreibweisen für Farben lernst du in der Lektion über Farben kennen.

Um mehrere Deklarationen zu schreiben, trenne sie mit Semikolons:

<p style="color: orange; text-align: center">CSS lernen!</p>

CSS lernen!

Die Eigenschaft text-align richtet den Text aus, hier zur Mitte.