1. Textgestaltung
Lass uns HTML weiter lernen...
Absätze (p)
Der Tag <p> wird verwendet, um Absätze (Paragraphen) im Text zu erstellen. Absätze helfen dabei, den Text in logische Blöcke zu unterteilen und die Lesbarkeit sowie die Wahrnehmung der Informationen zu verbessern.
Beispiel:
<p>Das ist der erste Absatz des Textes. Er enthält einige Informationen.</p>
<p>Das ist der zweite Absatz des Textes. Er ist vom ersten Absatz getrennt.</p>
Fetter Text (b)
Der Tag <b> wird verwendet, um Text fett zu markieren (bold). Dies ermöglicht es, die Bedeutung bestimmter Wörter oder Sätze hervorzuheben.
<p>Das ist <b>wichtiger</b> Text.</p>
Kursiver Text (i)
Der Tag <i> wird verwendet, um Text kursiv zu markieren (Schrägschrift, italic). Er wird häufig verwendet, um Begriffe, Buchtitel, Fremdwörter usw. hervorzuheben.
Beispiel:
<p>Das ist <i>ein Begriff</i>, der kursiv hervorgehoben ist.</p>
2. Überschriften (h1 - h6)
Überschriften in HTML werden verwendet, um Inhalte zu strukturieren und eine Hierarchie von Überschriften auf der Seite zu erstellen. Es gibt sechs Ebenen von Überschriften, wobei <h1> die wichtigste ist und <h6> die am wenigsten wichtige.
-
<h1>— Die wichtigste und größte Überschrift. Wird normalerweise als Hauptüberschrift der Seite verwendet. -
<h2>— Wird für Unterüberschriften verwendet, die auf<h1>folgen. -
<h3>— Eine niedrigere Überschriftebene als<h2>. -
<h4>— Eine niedrigere Überschriftebene als<h3>. -
<h5>— Eine niedrigere Überschriftebene als<h4>. -
<h6>— Die am wenigsten wichtige und kleinste Überschrift.
Beispiel:
<h1>Hauptüberschrift der Seite</h1>
<h2>Unterüberschrift Ebene 2</h2>
<h3>Unterüberschrift Ebene 3,</h3>
3. Zusätzliche Tags im Head-Dokument
Es gibt Tags, die du in Zukunft in HTML-Beispielen sehen kannst. Ich möchte ein paar Worte über sie sagen:
1. Der Tag <title>
Der Tag <title> setzt den Seitentitel, der im Browser-Tab angezeigt wird. Es ist das Erste, was ein Benutzer sieht, wenn er die Seite öffnet. Es ist fast immer auf allen Seiten vorhanden. Es wird standardmäßig vom HTML-Editor hinzugefügt, hat aber für Lernprojekte keinen besonderen Wert.
2. Der Tag <meta charset="UTF-8">
Der Tag <meta> in <head> legt die Zeichenkodierung für das Dokument fest. UTF-8 ist die am häufigsten verwendete Kodierung, die die meisten Sprachen der Welt unterstützt. Wir werden später ein wenig über Kodierungen sprechen.
3. Der Tag <meta name="viewport" content="width=device-width, initial-scale=1.0">
Dieser Tag befindet sich ebenfalls innerhalb von <head>. Er gewährleistet die korrekte Darstellung der Seite auf mobilen Geräten. Er legt die Breite des Ansichtsbereichs (viewport) auf die Bildschirmbreite des Geräts fest und den Anfangsmaßstab der Seite.
4. Der Tag <link rel="stylesheet" href="styles.css">
Der Tag <link/> verbindet eine externe CSS-Datei zur Seitenstilisierung. Das Attribut rel="stylesheet" gibt an, dass es sich um ein Stylesheet handelt, und href="styles.css" legt den Pfad zur Stylesheet-Datei fest.
5. Der Tag <script src="script.js" defer></script>
Der Tag <script> verbindet eine externe JavaScript-Datei, um Interaktivität zur Seite hinzuzufügen. Das Attribut src gibt den Pfad zur Scriptdatei an, und defer sagt dem Browser, dass das Skript nach dem Laden des HTML-Dokuments ausgeführt werden soll.
GO TO FULL VERSION