<div>

Übersicht

Das HTML-Element <div> (Englisch: HTML Document Division Element) ist ein allgemeiner Container für fließenden Inhalt, dem keine semantische Bedeutung zugeordnet wird.

Der wesentliche Unterschied zwischen <div> und anderen Block-Elementen wie beispielsweise <article> oder <p> ist die semantische Bedeutung bzw. das Fehlen dieser. Während <article> einen Artikel, einen eigenständigen Bereich eines Dokuments darstellt und <p> einen Textabsatz, gibt <div> seinem Inhalt keine Bedeutung.
<div> sollte deshalb nur genutzt werden, falls kein anderes Block-Element eine zutreffendere Aussage macht.

Der Einsatzbereich von <div> ist die Gruppierung von Elementen alleine zum Zweck der Gestaltung oder des programmatischen Zugriffs (mit Hilfe des class- oder id-Attributs), oder weil sie die gleichen Attribut-Werte besitzen, wie zum Beispiel das Attribut lang.

Inhaltskategorien Fließender Inhalt, greifbarer Inhalt.
Erlaubter Inhalt Fließender Inhalt.
Tag Auslassung Keine, sowohl das Anfangs- als auch das End-Tag sind erforderlich.
Erlaubte Elternelemente Jedes Element, dass fließenden Inhalt erlaubt.
DOM-Schnittstelle HTMLDivElement

Attribute

Dieses Element unterstützt nur die globalen Attribute, insbesondere class und id.

HTML5 Das align-Attribut ist für <div>-Elemente nicht mehr zulässig.

Beispiel

HTML

<div class="beispiel">
  <p>Dies ist ein sehr interessanter Hinweis
     in einem hübsch dekorierten Kasten.
  </p>
</div>

CSS

.beispiel {
  width: 15em;
  border: 1px solid #333;
  box-shadow: 8px 8px 5px #444;
  padding: 8px 12px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
}

Ergebnis

Spezifikationen

Browserkompatibilität

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

Siehe auch