Text und Formatierung
3. Text und Formatierung
HTML bietet eine Vielzahl von Tags, um Text auf einer Webseite zu strukturieren und zu formatieren. Hier lernst du die grundlegenden Text-Tags und Formatierungsmöglichkeiten kennen.
3.1. Grundlegende Text-Tags
Überschriften
HTML bietet sechs verschiedene Überschriften-Tags, die von <h1> (die wichtigste) bis <h6> (die am wenigsten wichtige) reichen.
Beispiele:
<h1>Überschrift 1</h1>
<h2>Überschrift 2</h2>
<h3>Überschrift 3</h3>
<h4>Überschrift 4</h4>
<h5>Überschrift 5</h5>
<h6>Überschrift 6</h6>
Absätze
Absätze werden mit dem <p>-Tag erstellt. Sie sind der grundlegende Blocktext für HTML-Dokumente.
Beispiel:
<p>Dies ist ein Absatz. Absätze werden verwendet, um Textblöcke zu strukturieren.</p>
Zeilenumbruch
Ein Zeilenumbruch wird mit dem <br>-Tag erstellt. Dieses Tag ist selbstschließend.
Beispiel:
<p>Dies ist der erste Satz.<br>Dies ist der zweite Satz auf einer neuen Zeile.</p>
Horizontale Linie
Eine horizontale Linie wird mit dem <hr>-Tag erstellt. Dieses Tag ist ebenfalls selbstschließend und wird verwendet, um Abschnitte visuell zu trennen.
Beispiel:
<p>Text vor der Linie.</p>
<hr>
<p>Text nach der Linie.</p>
3.2. Textformatierung
Fett und kursiv
Um Text fett oder kursiv zu formatieren, werden die Tags <b> oder <strong> für fett und <i> oder <em> für kursiv verwendet.
Beispiele:
<p>Dies ist <b>fetter Text</b>.</p>
<p>Dies ist <strong>starker Text</strong>.</p>
<p>Dies ist <i>kursiver Text</i>.</p>
<p>Dies ist <em>betonter Text</em>.</p>
Unterstrichen und kleiner Text
Um Text zu unterstreichen oder kleiner darzustellen, werden die Tags <u> und <small> verwendet.
Beispiele:
<p>Dies ist <u>unterstrichener Text</u>.</p>
<p>Dies ist <small>kleiner Text</small>.</p>
3.3. Listen
HTML bietet ungeordnete (bullet point) und geordnete (nummerierte) Listen. Ungeordnete Listen verwenden das <ul>-Tag und geordnete Listen das <ol>-Tag. Listenelemente werden mit dem <li>-Tag erstellt.
Ungeordnete Liste:
<ul>
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
<li>Dritter Punkt</li>
</ul>
Geordnete Liste:
<ol>
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
<li>Dritter Punkt</li>
</ol>
3.4. Blockzitate und Vorformatierter Text
Blockzitate
Blockzitate werden mit dem <blockquote>-Tag erstellt und werden verwendet, um längere Zitate darzustellen.
Beispiel:
<blockquote>
Dies ist ein längeres Zitat. Es wird typischerweise verwendet, um längere Abschnitte von Text, die von einer anderen Quelle stammen, zu formatieren.
</blockquote>
Vorformatierter Text
Vorformatierter Text wird mit dem <pre>-Tag erstellt und behält die im HTML-Code eingegebenen Leerzeichen und Zeilenumbrüche bei.
Beispiel:
<pre>
Dies ist vorformatierter Text.
Er behält alle Leerzeichen
und Zeilenumbrüche bei.
</pre>