Webseitenbau
Home
Site/Index
 
Web Webseitenbau
Google English français  
⬆2. 5. 4 Zeile (line)

2.5.4 Zeile
en Line
fr Ligne

Pfeil nach rechts (Icon)
      120 x 120 Pixel Text-Formatierung: Zeile, Zeilenhöhe

-

1 Zeilenumbruch erzwingen <br> (break)

-

a) Bezeichnungen

-

b) Prinzip

Am Ende der Zeile signalisiert <br>,
dass ein manueller Zeilenumbruch eingefügt werden soll

-

c) Beispiel: <br>

1) Angabe im Quelltext des HTML-Dokumentes:

<br> erzeugt einen Zeilenumbruch

<p>
 Vor drei Wochen habe ich erfahren,<br>
 dass Du krank bist.<br>
 Mach' Dir keine Sorgen.<br>
 Mir geht es gut.
</p>

2) Anzeige im HTML-Dokument:

Vor drei Wochen habe ich erfahren,
dass Du krank bist.
Mach' Dir keine Sorgen.
Mir geht es gut.

-

2 Textumbruch white-space (white space)

-

a) Bezeichnungen

-

b) Prinzip

Mit white-space: kann das Verhalten für den Zeilenumbruch festlegt werden.
Folgende Angaben sind möglich:

-

c) Beispiel 1: <p style="white-space:pre">...</p>

Bitte beachten: Die Schrift ist die gleiche wie ein normaler Text.
(Dies ist die richtige Art Text auszurichten)

<p style="white-space:pre">
  Land	    Deutschland Frankreich Schweiz	
  Ländercode  DE          FR         CH
</p>			

Land Deutschland Frankreich Schweiz Ländercode DE FR CH

-

d) Beispiel 2: Vergleich mit der <pre>...</pre> Formatierung

⇒ Siehe auch Formatierung mit <pre>

Bitte beachten: Die Schrift ist diejenige der pre-Ansicht, normalerweise monospace
(Dies kann so also nicht für die Textausrichtung verwendet werden)

<pre>
 Land		Deutschland    	Frankreich     Schweiz	
 Ländercode	DE		FR             CH
</pre>
 Land		Deutschland    	Frankreich     Schweiz	
 Ländercode	DE		FR             CH

-

e) Beispiel 3: <p style="white-space:nowrap">...</p>

<p style="white-space:nowrap">
Wird nicht umgebrochen, 
auch wenn Sie das Fenster verkleinern.	
</p>			

Wird nicht umgebrochen, auch wenn Sie das Fenster verkleinern.

-

f) Workshops

-

3 Geschützte Leerzeichen &nbsp; (nonbraking space)

-

a) Bezeichnungen

-

b) Prinzip

-

c) Beispiel 1: &nbsp;

1) Angabe im Quelltext des HTML-Dokumentes:

<p style="color:red">
 Es gibt vieles, worin sich HTML&nbsp;2.0
 und HTML&nbsp;4.0 unterscheiden.
 Es gibt vieles, worin sich HTML&nbsp;2.0
 und HTML&nbsp;4.0 unterscheiden.
</p>

2) Anzeige im HTML-Dokument:

Es gibt vieles, worin sich HTML 2.0 und HTML 4.0 unterscheiden. Es gibt vieles, worin sich HTML 2.0 und HTML 4.0 unterscheiden.

(Auch bei verkleinertem Anzeigefenster wird die Zeile nicht zwischen HTML und 2.0 oder HTML und 4.0 getrennt.)

-

d) Workshops

-

4 Zeilenumbruch erlauben "&shy;, <wbr>, &#8203;

-

a) Bezeichnungen und Prinzip

Bedingte Trennung gemäss Beispielen in den Workshops

-

b) Workshop mit Beispielen