Block-Level Elemente

Block- und Inline-Elemente sind die zwei ursprünglichen Kategorien der darstellenden HTML-Elemente.

Block-Elemente nehmen typischerweise die gesamte verfügbare Breite ihres Elternelements ein und grenzen ihren Inhalt vertikal durch je einen Zeilenumbruch gegenüber den vor- und nachfolgenden Elementen ab. Auf diese Weise erzeugen sie den rechteckigen Block, der ihnen den Namen gibt.

Block-Elemente stellen inhaltlich einen zusammenhängenden Bereich dar und geben ihm eine semantische Bedeutung. Prominentes Beispiel für ein Block-Element ist <p>, das einen Textabsatz (Englisch: paragraph) umfasst und mit Abständen darüber und darunter von anderen Bereichen des Dokuments trennt.
Einzige Ausnahme ist von dieser Regel ist <div>; dieses hat keine semantische Bedeutung und dient lediglich dem Zugriff auf den betreffenden Bereich mittels CSS oder Javascript.

Gemeinhin können Block-Elemente Inline- und meist auch weitere Block-Elemente enthalten. Dieser strukturellen Unterscheidung liegt die Idee zugrunde, dass auf Block-Ebene größere Strukturen definiert werden als auf Inline-Ebene.
Die höchste Ebene für Block-Elemente selbst ist das Element <body>.

Die einfache Unterscheidung zwischen Block- und Inline-Ebene wird in HTML-Spezifikationen bis einschließlich Version 4.01 verwendet. In HTML 5 wird diese Zweiteilung zu einem komplexeren Satz von Inhaltskategorien ergänzt. Hierbei entspricht die Block-Ebene in HTML 5 grob der Kategorie fließender Inhalte, während die Inline-Ebene der Kategorie gestaltender Inhalte gleichkommt. Darüber hinaus existieren weitere Kategorien.

Elemente

Die nachfolgende Liste zeigt eine komplette Übersicht aller HTML-Block-Elemente (die neuen HTML-5-Elemente sind technisch gesehen nicht als Block-Elemente definiert).

<address>
Kontaktinformation.
<article> HTML5
Inhalt eines Artikels.
<aside> HTML5
Anmerkungen.
<audio> HTML5
Audio-Wiedergabe.
<video> HTML5
Video-Wiedergabe.
<blockquote>
Zitat in Form eines eigenständigen Absatzes.
<canvas> HTML5
Bereich zum Zeichnen und Malen.
<dd>
Definition, Beschreibung.
<div>
Allgemeine Unterteilung ohne semantische Aussage.
<dl>
Definitionsliste.
<fieldset>
Gruppe von Elementen im Formular oder Reiter im Dialog.
<figcaption> HTML5
Beschreibung einer Grafik.
<figure> HTML5
Grafik mit Beschreibung (siehe <figcaption>).
<footer> HTML5
Fußbereich.
<form>
Eingabeformular.
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
Überschriften in Abstufung 1 bis 6.
<header> HTML5
Kopfbereich.
<hgroup> HTML5
Gruppe mehrerer Überschriften.
<hr>
Horizontrale Trennlinie.
<noscript>
Ersatzinhalt, falls JavaScript deaktiviert ist.
<ol>
Geordnete Liste.
<output> HTML5
Dynamisch erzeugte Ausgaben.
<p>
Textabsatz.
<pre>
Vorformatierter Text.
<section> HTML5
Abschnitt einer Seite.
<table>
Tabelle.
<tfoot>
Fußbereich der Tabelle.
<ul>
Ungeordnete Liste.

Siehe auch