line-height

Die Eigenschaft line-height definiert die Höhe einer Zeile und wird häufig verwendet, um den Abstand zwischen Textzeilen anzupassen. Standardmäßig hängt line-height von der Schriftart des Textes ab und wird vom Browser bestimmt.

line-height: multiplier | value in px | value in em | percent 

• multiplier ist ein Wert ohne Einheit (z. B. 1.5). In diesem Fall ist die Zeilenhöhe das 1.5-Fache des Wertes von font-size;
• value in px ist ein spezifischer Wert (z. B. 24px), auf den die Zeilenhöhe gesetzt wird;
• value in em ist ein Wert (z. B. 1.4em), der ähnlich wie der multiplier funktioniert. Der Browser prüft den Wert von font-size, multipliziert diesen mit 1.4 und das Ergebnis ist die Zeilenhöhe;
• percent ist ein Wert (z. B. 120%), der wie ein multiplier funktioniert. Der Wert von font-size wird mit 1.2 multipliziert, was die Zeilenhöhe bestimmt.

Ausgabe

letter-spacing

Die Eigenschaft letter-spacing legt den horizontalen Abstand zwischen Textzeichen fest.

letter-spacing: normal | value in px | value in em

• normal ist der Standardabstand zwischen Zeichen;
• value in px ist ein spezifischer Wert, der zusätzlichen Abstand zwischen Zeichen hinzufügt;
• value in em funktioniert ähnlich wie px, aber der Abstand ist relativ zur font-size.

Ausgabe

word-spacing

Die Eigenschaft word-spacing definiert den Abstand zwischen Wörtern im Text. Sie vergrößert den Abstand zwischen den Wörtern. Befinden sich Satzzeichen im Text und sind diese direkt an Wörter angeschlossen, bleiben sie weiterhin ohne Abstand mit den Wörtern verbunden.

word-spacing: value | inherit | normal

• value ist ein spezifischer Wert, der den Abstand zwischen den Wörtern festlegt;
• inherit übernimmt den Wortabstand vom Elternelement;
• normal ist der Standardabstand zwischen Wörtern.

Ausgabe

text-shadow

Die Eigenschaft text-shadow fügt dem Text einen Schatten hinzu.

text-shadow: "X set" | "Y set" | "blur radius" | "color"

• X set passt die horizontale Position des Schattens an. Positive Werte verschieben den Schatten nach rechts, negative Werte nach links;
• Y set passt die vertikale Position des Schattens an. Positive Werte verschieben den Schatten nach unten, negative Werte nach oben;
• blur radius definiert, wie verschwommen der Schatten erscheint. Höhere Werte machen den Schatten weicher und diffuser. Der Standardwert ist 0, falls nicht angegeben;
• color legt die Farbe des Schattens in jedem gültigen Farbformat fest. Falls nicht angegeben, wird die Textfarbe verwendet.

Ausgabe

Hinweis

Beim Textformatieren gibt es keine strikten Regeln, die vorschreiben, welche Werte in bestimmten Situationen verwendet werden müssen. Die Auswahl der Eigenschaften und Werte zur Textformatierung hängt von den individuellen Anforderungen jedes Projekts und der gestalterischen Vision ab.