<dl>

von 2 Mitwirkenden:

Übersicht

Das HTML <dl> Element (oder HTML Description List Element) umfasst eine Liste von Begriffspaaren und Beschreibungen. Üblicherweise wird das Element zur Implementierung eines Glossars oder zur Anzeige von Metadaten (eine Liste von Schlüsselwertpaaren) genutzt.

Vor HTML5, war <dl> bekannt als Definition List.

  • Inhaltskategorien Fließender Inhalt, wenn das <dl> Elementkind nur ein Wertepaar beinhaltet, dann greifbarer Inhalt.
  • Erlaubter Inhalt Null oder mehr <dt> Elemente, jedes gefolgt von einem oder mehreren  <dd> Elementen.
  • Tag Auslassung Keine, sowohl das Anfangs- als auch das End-Tag sind erforderlich.
  • Erlaubte Elternelemente Jedes Element, dass fließenden Inhalt erlaubt.
  • DOM Schnittstelle HTMLDListElement

Attribute

Dieses Element schließt globale Attribute ein.

compact
Zwingt die Beschreibung dazu, in derselben Linie zu erscheinen wie der Begriff. Dieses Attribut wird aktuell nicht supported.

Beispiele

Einzelbegriff und Beschreibung

<dl>
  <dt>Firefox</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>

  <!-- other terms and definitions -->
</dl>

Ausgabe:

Image:HTML-dl1.png

Multiple Begriffe, einzelne Beschreibung

<dl>
  <dt>Firefox</dt>
  <dt>Mozilla Firefox</dt>
  <dt>Fx</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>

  <!-- other terms and definitions -->
</dl>

Ausgabe:

Image:HTML-dl2.png

Einzelbegriff, multiple Beschreibungen

<dl>
  <dt>Firefox</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>
  <dd>The Red Panda also known as the Lesser Panda, Wah, Bear Cat or Firefox,
      is a mostly herbivorous mammal, slightly larger than a domestic cat
      (60 cm long).</dd>

  <!-- other terms and definitions -->
</dl>

Ausgabe:

Image:HTML-dl3.png

Multiple Begriffe und Beschreibungen

Es ist ebenfalls möglich, multiple Begriffe und Beschreibungen zu definieren, wenn man die oberen Beispiele kombiniert.

Metadata

Description Lists sind nützlich um Metadaten als Wertepaar-Listen anzuzeigen.

<dl>
    <dt>Name</dt>    
    <dd>Godzilla</dd>
    <dt>Born</dt>
    <dd>1952</dd>
    <dt>Birthplace</dt>
    <dd>Japan</dd>
    <dt>Color</dt>
    <dd>Green</dd>
</dl>

Tipp: Es kann hilfreich sein, Separatoren für Schlüsselwerte in CSS3 zu definieren, wie zum Beispiel: dt:after {content": ";}

 

Anmerkungen

Weder dieses Element, noch das <ul> Element, sollten genutzt werden, um bloß eine Einrückung vorzunehmen. Es funktioniert zwar, wird in der Praxis jedoch nicht angewendet und verfehlt die Definition einer Description List.

Um die Einrückung eines Begriffs zu ändern, sollte die CSS margin Eigenschaft genutzt werden.

Spezifikationen

Spezifikation Status Kommentar
WHATWG HTML Living Standard
Die Definition von '<dl>' in dieser Spezifikation.
Lebender Standard  
HTML5
Die Definition von '<dl>' in dieser Spezifikation.
Vorgeschlagene Empfehlung  
HTML 4.01 Specification
Die Definition von '<dl>' in dieser Spezifikation.
Empfehlung  

Browser Kompatibilität

Help improve compatibility tables by filling out this 11 question survey.
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 (Ja) (Ja) (Ja) (Ja)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support (Ja) (Ja) (Ja) (Ja) (Ja)

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: wtw, kklein
Zuletzt aktualisiert von: wtw,