Abschnitte & Zeilenumbruch
Nun hast du verschiedene Elemente kennengelernt, mit denen du Text darstellen kannst. Aber wie stellt man eigentlich ganze Absätze oder Textbereiche dar?
Ein Element dafür hast du bereits kennengelernt, nämlich das p-Element. Mit diesem Element kannst Du einen Absatz definieren.
Du kannst mehrere <p>-Elemente untereinander stellen und wirst immer neue Textabschnitte erhalten. Das p-Element formatiert den Text immer auf den Vorgaben des Browsers.
(Leerzeichen und Zeilenumbrüche bestimmt der Browser. Naja fast, denn wir können das beinflussen mit weiteren Elementen.)
Möchten wir einen Zeilenumbruch im p-Element erzwingen, kannst du das <br> Element verwenden. Das Interessante hier ist: Das <br> hat kein Endelement und steht nur für sich selbst.
Schaue dir folgendes Beispiel mit dem <br>-Element an:
<p>Die Milchstraße ist verdammt groß <br>
kein Mensch hat es bisher geschafft sie zu durchqueren.</p>
Du kannst aber auch ganze Abschnitte mit einer Trennlinie, voneinander trennen. Dafür gibt es das hr-Element.
<p> Die Milchstraße ist verdammt groß.</p>
<hr>
<p> Aber auch die Größe unseres Sonnensystems ist für uns unbegreiflich. </p>
Besondere Textelemente sind z.B. pre, code und q.
<p><q>Das ist das q-Element im Einsatz</q> sagt Arek von
<pre>lerneProgrammieren.de();</pre></p>
Das q-Element ist für Zitate und Gesagte gedacht. Das pre-Element hat die Besonderheit, dass es den Text so darstellt, wie er im Element angegeben wurde, also mit allen Leerzeichen und Zeilenumbrüchen.
Wenn du mal Quelltext auf deiner Webseite zeigen möchtest, kannst du das code-Element verwenden. Dieses verwenden wir auf lerneProgrammieren.de fast ständig!
<code>//Das hier ist ein Beispiel
wichtigerProgrammBefehl();</code>