Verschachtelung und schließende Tags
Teil des Abschnitts Grundlagen der HTML-Journey von Coddy. Lektion 4 von 60.
In HTML bedeutet Verschachtelung, ein Element innerhalb eines anderen zu platzieren. Zum Beispiel kannst du ein <strong>-Tag innerhalb eines <p>-Tags platzieren, um Text innerhalb eines Absatzes fett darzustellen.
So sieht es aus:
<p>This is <strong>bold</strong> text.</p>Schließende Tags sind entscheidend. Jeder öffnende Tag muss einen entsprechenden schließenden Tag haben.
Das End-Tag ist dasselbe wie das Start-Tag, jedoch mit einem Schrägstrich (/) vor dem Tag-Namen. Zum Beispiel beginnt <p> einen Absatz, und </p> beendet ihn.
Eine falsche Verschachtelung kann zu Darstellungsproblemen führen. Achte immer darauf, Tags in der richtigen Reihenfolge zu schließen. Das innere Tag sollte vor dem äußeren Tag geschlossen werden.
Korrekte Verschachtelung:
<p>This is <strong>bold</strong> text.</p>Falsche Verschachtelung:
<p>This is <strong>bold text.</p></strong>Aufgabe
EinfachDir wird ein HTML-Dokument mit einem Absatzelement gegeben. Verschachtle innerhalb des Absatzes ein <strong>-Element um das Wort „important“.
Probier es selbst
<!DOCTYPE html>
<html>
<body>
<p>This is an important message.</p>
</body>
</html>Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Grundlagen
1HTML-Grundlagen
Was ist HTML?Grundstruktur von HTMLTags und ElementeVerschachtelung und schließende TagsKommentare in HTML2Text und Formatierung
ÜberschriftenAbsätzeZeilenumbrücheFetter und kursiver TextNochmals fett und kursivWiederholung – Formatierung8Formulare und Eingaben Teil 1
Formular-GrundlagenTexteingabenInput-AttributePasswortfeldLabels für EingabenZusammenfassung – Einfaches Formular11Event-Registrierungsseite
ProjektübersichtHeader-Bereich6Seitenlayout
Bereiche (Divisions)Inline-SpansSemantische TagsSections und ArticlesZusammenfassung – Layout9Formulare und Eingaben Teil 2
Radio-ButtonsCheckboxenDropdownsButtonsButtons in FormularenWiederholung - Formulare #1Wiederholung - Formulare #212Abschlussherausforderungen
Einfache ProfilkarteEvent-EinladungskarteEinfache ArtikelseiteLieblingsbücher-ListeÜbe selbstständig: Web-Playground