homepage-buttons.de
Homepagevorlagen, Buttons und mehr
 
 
 

2 HTML-Kurs - Text einfügen und formatieren (4)

2.4 Was bedeutet Textumbruch und wie formatiert man ihn?


In Kapitel 1.1 haben wir gelernt, wie die Grundstruktur einer HTML-Datei aussieht. Das zu wissen ist ja alles schön und gut, aber wirklich interessant wird es für den ungeduldigen Webmaster erst, wenn er (oder sie) endlich loslegen kann, die Texte und Grafiken im Body-Bereich einzufügen und zu gestalten. Damit fangen wir in diesem Kapitel an.

Fragen:
1.) Was hat es nun mit der seltsamen Überschrift "Textumbruch" auf sich?
2.) Kann ich nicht einfach wie in Word losschreiben, bei einem neuen Absatz auf die Enter-Taste drücken und fertig ist die Laube?

Antwort: Bei einem normalen WYSIWYG-Editor wie dem Netscape Composer mag das funktionieren, wer aber richtig HTML lernen will, muss ein paar Grundregeln kennen.

HTML-Text kann man sogar schon in dem Windows-Editor Notepad erstellen, solange die Endung der Datei beim Abspeichern .html (oder .htm) genannt wird. Komfortabler ist es, einen Editor wie z.B. Phase 5 zu nutzen.

Ein Text (inkl. Grundgerüst), den ich im Editor schreibe, könnte wie folgt aussehen:

<html>
<head>
</head>
<body>
Hallo Leute!

Endlich ist es soweit, meine TOLLE Seite ist online!
Schaut euch alle Sachen an!

Bis dann

Euer

Garfield
</body>
</html>

Im Browser sieht das ganze dann jedoch so aus:

Hallo Leute! Endlich ist es soweit, meine TOLLE Seite ist online! Schaut euch alle Sachen an! Bis dann Euer Garfield

Und nun? Was muss ich tun, damit der Text umgebrochen wird?

Für die Lösung unseres Problems stehen zwei Tags zur Verfügung:

<br> und

<p> bzw. </p>

Zwischen diesen beiden Tags gibt es deutliche Unterschiede.

<br> wird verwandt, wenn eine Zeile umbrochen werden soll. Er wird einfach hinter dem letzten Wort einer Zeile eingefügt, hinter dem ein Zeilenumbruch gewünscht wird, bevor eine neue Zeile begonnen werden soll.

Mit dem Tag <p> </p> wird ein Absatz definiert. Das bedeutet, dass am Anfang eines Absatzes <p> steht und am Ende des Absatzes </p> eingefügt wird. Der End-Tag </p> ist nicht zwingend erforderlich, sollte allerdings aus verschiedenen Gründen trotzdem eingefügt werden. So können sich z.B. in dem <p>-Tag weitere Formatierungen befinden, die nur für diesen Absatz gültig sein sollen. Wenn der End-Tag fehlen würde, würde diese Formatierung sich durch das weitere Dokument ziehen, was nicht unbedingt gewünscht wird. Außerdem entspricht ein fehlendes </p> nicht dem W3C-Standard.

Kleine Randbemerkung: werden keine der obigen Tags eingefügt, so wird natürlich trotzdem der Text irgendwann umgebrochen und zwar dann, wenn das Browserfenster zuende ist. Das ist sozusagen die natürliche Begrenzung. Wir reden hier lediglich von Zeilenumbrüchen an von uns selber gewünschten Stellen.

Für unser Beispiel sollte die Formatierung nun wie folgt aussehen:

<html>
<head>
</head>
<body>

<p>Hallo Leute!</p>

<p>Endlich ist es soweit, meine TOLLE Seite ist online!<br>
Schaut euch alle Sachen an!</p>

<p>Bis dann</p>

<p>Euer</p>

<p>Garfield</p>

</body>
</html>

Die Ausgabe im Browser sieht dann wie folgt aus:

Hallo Leute!

Endlich ist es soweit, meine TOLLE Seite ist online!
Schaut euch alle Sachen an!

Bis dann

Euer

Garfield


Zusammenfassung:

Beschreibung

Erzwingt einen Zeilenumbruch

Verhindert einen Zeilenumbruch

Definiert einen neuen Absatz