Bereiche (Divisions)
Teil des Abschnitts Grundlagen der HTML-Journey von Coddy. Lektion 25 von 60.
Stell dir vor, du möchtest deine Webseite in Blöcke unterteilen, um deine Inhalte zu organisieren. In HTML kannst du ein div verwenden, um Elemente zu gruppieren.
div-Tags eignen sich hervorragend zum Erstellen von Layouts und zum Trennen von Abschnitten.
Hier ist die grundlegende Syntax:
<div>
<!-- Inhalt kommt hierher -->
</div>Du kannst andere HTML-Elemente innerhalb eines div hinzufügen, beispielsweise Absätze, Überschriften, Bilder und sogar weitere div-Elemente.
Hier ist ein Beispiel dafür, wie du div-Tags verwenden kannst, um ein einfaches Layout mit einem Header, einem Hauptinhaltsbereich und einer Fußzeile zu erstellen:
<div>
<h1>Header</h1>
</div>
<div>
<p>Main content goes here.</p>
</div>
<div>
<p>Footer</p>
</div>Aufgabe
EinfachErstelle 3 div-Elemente, die in deinem HTML-Dokument aufeinanderfolgen.
Füge in jedes div ein p-Tag ein, das den Namen eines Films enthält, der dir gefällt.
Probier es selbst
<!DOCTYPE html>
<html>
<body>
<!-- Schreibe Code hier -->
</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
2Text 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