Stil mit {stil}

Feb 2009

white-space • Behandlung von Leerzeichen

Per Vorgabe ignorieren Browser aufeinander folgenden Leerzeichen und Zeilenumbrüche im Quelltext von HTML-Seiten – für eine Vergrößerung oder Verkleinerung des Raums zwischen aufeinander folgenden Wörtern ist die Eigenschaft word-spacing vorgesehen. Mit der CSS-Eigenschaft white-space soll sich ein Text verhalten wie ein pre-Element und Leerzeichen und Zeilenumbrüche so wiedergeben, wie sie im Quelltext gesetzt sind.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Praesent leo quam, ultricies ut, ultricies interdum, blandit a, ante. 
Sed vitae ligula. In a quam … </p> 

<p style="white-space: pre;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Praesent leo quam, ultricies ut, ultricies interdum, blandit a, ante. 
Sed vitae ligula. In a quam …</p>

• text-align
• letter-spacing
• text-decoration
• text-indent
• text-transform
• [ white-space ]
• word-spacing

white-space

IE5.5+ M1 N4+ O5+ Sa1 CSS1 Erblich: Ja

white-space

steuert den Weißraum innerhalb eines Elements.

Werte

normal | pre | nowrap | pre-wrap | pre-line | inherit

normal

ist die Standardeinstellung.

pre

verhält sich wie das HTML-Tag <pre>.

pre-wrap

verhindert, dass der Browser aufeinander folgende Leerzeichen ignoriert. Zeilen werden so umgebrochen, wie sie im Quelltext umgebrochen werden, bei generierten Inhalten werden Zeilen durch ein \A umgebrochen und Zeilen werden so umgebrochen, dass Boxen wie gewohnt gefüllt werden.

pre-line

lässt aufeinanderfolgende Leerzeichen wie gewohnt kollabieren, aber bei generierten Inhalten erzeugt \A einen Zeilenumbruch.

nowrap

lässt den Text auf einer Zeile laufen, bis der Text beendet ist oder ein HTML-Tag <br /> entdeckt wird. <br /> erzeugt einen Zeilenumbruch auf die nächste Zeile.

zurück zum Seitenanfang