📝 Überschriften & Absätze

💡 Was du heute lernst:
Wie du Texte mit Überschriften und Absätzen strukturierst.

📌 Überschriften - `<h1>` bis `<h6>`

Überschriften geben deiner Webseite eine Struktur - wie in einem Buch.

<h1>Größte Überschrift (wichtigste)</h1>
<h2>Zweitgrößte Überschrift</h2>
<h3>Drittgrößte Überschrift</h3>
<h4>Viertgrößte Überschrift</h4>
<h5>Fünftgrößte Überschrift</h5>
<h6>Kleinste Überschrift</h6>

Größte Überschrift (wichtigste)

Zweitgrößte Überschrift

Drittgrößte Überschrift

Viertgrößte Überschrift

Fünftgrößte Überschrift

Kleinste Überschrift

⚠️ Wichtig: <h1> sollte nur einmal pro Seite verwendet werden (für den Haupttitel). <h2> bis <h6> für Unterüberschriften.

📄 Absätze - `<p>`

Für normalen Text verwendest du den Absatz-Tag.

<p>Das ist ein normaler Textabsatz. Er wird automatisch umgebrochen und hat etwas Abstand zu anderen Absätzen.</p>

<p>Das ist ein weiterer Absatz. Zwischen den Absätzen ist immer etwas Platz.</p>

Das ist ein normaler Textabsatz. Er wird automatisch umgebrochen und hat etwas Abstand zu anderen Absätzen.

Das ist ein weiterer Absatz. Zwischen den Absätzen ist immer etwas Platz.

↕️ Zeilenumbruch - `<br>`

Manchmal möchtest du einen Zeilenumbruch ohne neuen Absatz:

<p>
Erste Zeile<br>
Zweite Zeile<br>
Dritte Zeile
</p>

Erste Zeile
Zweite Zeile
Dritte Zeile

💪 Text hervorheben

Fetter Text (wichtig):

<p>Das ist <strong>wichtig</strong> und <strong>fett</strong>.</p>

Das ist wichtig und fett.

Kursiver Text (betont):

<p>Das ist <em>kursiv</em> und <em>betont</em>.</p>

Das ist kursiv und betont.

🎯 Übungsaufgabe

✏️ Aufgabe:

Erstelle eine Seite über dich mit:

Einem <h1>-Titel: "Über mich"
Einem <h2>-Titel: "Meine Hobbys"
Einem Absatz mit deinem Namen und deinem Alter
Einem Absatz mit deinen Hobbys
Einem <h3>-Titel: "Mein Lieblingsfach"
Einem Absatz über dein Lieblingsfach

Tipp: Verwende <br> für Zeilenumbrüche und <strong> für wichtige Wörter.

📋 Zusammenfassung

Tag	Bedeutung	Beispiel
`<h1> - <h6>`	Überschriften (Größe 1-6)	`<h1>Titel</h1>`
`<p>`	Absatz (Textblock)	`<p>Text</p>`
`<br>`	Zeilenumbruch	`Text<br>neue Zeile`
`<strong>`	Fetter Text (wichtig)	`<strong>wichtig</strong>`
`<em>`	Kursiver Text (betont)	`<em>betont</em>`