Schriftformatierung

Inline-Formatierung:
CSS kann man mit HTML-Befehlen verknüpfen. Das nennt man Inline-Formatierung.

Beispiel:

<h1 style="color: red;">Rote Überschrift</h1>

Erklärung:
Im  HTML-Befehl  (hier  <h1>…</h1>)  wird  die  Inline-Formatierung  mit  style=“…“  eingebaut.
Zwischen  den  Anführungszeichen  steht  die  CSS-Eigenschaft  (hier:  Farbe).
Dann  folgt  ein Doppelpunkt  und  der  Wert  (hier:  red).
Die  einzelnen  Formatierungen  werden  mit  einem Strichpunkt getrennt.

Wird nur ein Wort bzw. ein Satz formatiert, dann muss dieses Wort bzw. dieser Satz zwischen dem „Container“ <span>…</span> stehen.
Beispiel:

Dieses Wort ist <span style="color: red;">rot</span>.

Wird dagegen ein ganzer Absatz formatiert, dann müssen die Sätze zwischen dem Container <div>…</div> stehen.
Beispiel:

<div style="color: red">
Dieser komplette Absatz wird in roter Schrift dargestellt.<br />
Wenn man HTML lernen will, braucht man auch Grundkenntnisse in CSS.
</div>

Schriftfarbe:

color: Farbname;

Als Farbname können die üblichen HTML-Farbnamen oder die entsprechenden Hexadezimalwerte verwendet werden.

Schriftart:

font-family: Schriftart;

Es ist möglich, mehrere Schriftarten angeben, indem man sie durch Kommata trennt. Dann wird die erste Schriftart dieser Aufzählung angezeigt, die auf dem Computer verfügbar ist.
Es ist empfehlenswert, den Namen von Schriftarten, die Leerzeichen beinhalten, in einfache Anführungszeichen zu setzen.
Folgende Schriftfamilien sind vordefiniert:
serif  = eine Schriftart mit Serifen, z.B. Times New Roman
sans-serif  = eine Schriftart ohne Serifen, z.B. Arial
cursive  = eine Schriftart für Schreibschrift
fantasy  = eine Schriftart für ungewöhnliche Schrift
monospace  = eine Schriftart mit Zeichen, die alle gleich breit sind, z.B. Courier

Schriftgröße

font-size: Wert;

Für Wert kann man einen numerischen Wert sowie relative oder absolute Schlüsselwort angeben.
Gibt man einen Zahlenwert ein, so kommen folgende Einheiten oft vor: px (Pixel) oder em (Höhe des Buchstabens M)

Folgende Angaben sind möglich:
xx-small = winzig
x-small = sehr klein
small = klein
medium = mittel
large = groß
x-large = sehr groß
xx-large = riesig

Schriftgewicht
Das Schriftgewicht bezeichnet die Dicke und Stärke einer Schrift.

font-weight: Wert;

Folgende Angaben sind möglich:
bold = fett
bolder = extrafett
lighter = dünner
100 (extra-dünn) bis 900 (extrafett)

Bei den numerischen Werten entspricht die Angabe 500 dem den Begriff medium, und die Angabe 700 entspricht dem Begriff bold.
Beispiel für eine Kombination der Schriftformatierungen:

<div style="font-family: Arial; color: blue; font-size: 20px;">
Hier steht ein blauer Text der Schriftart Arial und der Größe 20 Pixel.
</div>

Ergebnis im Browser: