Zeichen- und Wortabstand

Mit den Eigenschaften letter-spacing und word-spacing lassen sich die Abstände zwischen Zeichen bzw. zwischen Wörtern eines Textes steuern. Beide Eigenschaften beeinflussen die Lesbarkeit und den optischen Eindruck eines Textblocks und werden häufig im typografischen Feinschliff eingesetzt.

letter-spacing

Die Eigenschaft letter-spacing verändert den Abstand zwischen einzelnen Buchstaben. Sie wird meist verwendet, um Headlines luftiger wirken zu lassen oder bei sehr engen Schriften die Lesbarkeit zu verbessern.

h2 {
  letter-spacing: -1px;
}
p {
  letter-spacing: 2px;
}

CSS

CSS definiert das Aussehen von HTML-Elementen.

Mögliche Werte für letter-spacing

Eigenschaftswert

Erklärung

normal

Standardwert. Der Browser übernimmt den definierten Zeichenabstand der Schriftart.

<Länge>

Ein positiver Wert (z. B. 2px, 0.1em) vergrößert den Abstand zwischen Buchstaben. Ein negativer Wert verkleinert ihn.

word-spacing

Die Eigenschaft word-spacing verändert den Abstand zwischen Wörtern. Sie eignet sich z. B. um Textblöcken mehr „Luft“ zu geben oder bei sehr engem Blocksatz das Schriftbild auszugleichen.

h2 {
  word-spacing: -2px;
}
p {
  word-spacing: 6px;
}

CSS ist die zweite Sprache des Webs

CSS definiert das Aussehen von HTML-Elementen.

Mögliche Werte für word-spacing

Eigenschaftswert

Erklärung

normal

Standardwert. Der Browser nutzt den normalen Wortabstand.

<Länge>

Ein positiver Wert vergrößert den Abstand zwischen Wörtern. Ein negativer Wert verringert ihn.