CSS, HTML und Javascript mit {stil}

letter-spacing und word-spacing • Text sperren, dehnen, stauchen

letter-spacing und word spacing

CSS letter-spacing und word-spacing vergrößern bzw. verkleinern den Platz zwischen aufeinander folgenden Zeichen oder Wörtern – letter-spacing und word-spacing werden zum normalen Abstand der Zeichen und Wörter addiert oder subtrahiert.

Als Maßeinheit für letter-spacing und word-spacing nutzt am besten relative Werte (z.B. die Maßeinheit »em«). Dann wächst der Raum zwischen den Zeichen und Wörtern mit, wenn der Benutzer die Schriftgröße der Seite ändert.

Sperren und Stauchen der Schrift sollten meist dafür sorgen, dass ein Text vollständig in eine Zeile, einen Block oder eine Tabellenzelle passt. Mehr oder weniger Platz für Wörter und Zeichen kann einen Text auch hervorheben, aber die Lesbarkeit leidet u.U.

Der Raum zwischen Wörtern und Zeichen wird mit word-spacing bzw. mit letter-spacing verändert. Bei kleinen Schriftgrößen kann letter-spacing bzw. word-spacing die Lesbarkeit u.U. verbessern.

Würde ein fester Abstand – z.B. 1px – eingesetzt, bliebe der Abstand von 1px bei Änderungen der Schriftgröße erhalten.

CSS letter-spacing und Blocksatz

Die CSS-Regel letter-spacing: kann die Ausrichtung im Blocksatz (text-align: justify) überschreiben.

Als es klingelte nachts und zwar kurz vor halb zehn, wurde niemand erwartet und niemand gesehen. Doch dann sahn sie auf einer Urne zuletzt eine fremde Erscheinung und waren entsetzt.

Werte für letter-spacing / word-spacing

letter-spacing / word-spacing
dehnt oder staucht den Raum zwischen aufeinander folgenden Zeichen bzw. Wörtern. Ein positiver Wert dehnt den Raum (»Text sperren«), ein negativer staucht den Zwischenraum.
Werte
normal | <length>
normal
ist die Standardeinstellung. Die Angabe normal verhindert, dass vorangegangene Deklarationen den Text beeinflussen.
length
kann in einer der folgenden Maßeinheiten angegeben werden: cm (Zentimeter),em (ems), ex (x-Höhe), in (Inch), mm (Millimeter), pc (Pica),pt (Punkt), px (Pixel)