<dfn>: Das Definitionselement

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das <dfn> HTML-Element kennzeichnet einen zu definierenden Begriff. Das <dfn>-Element sollte in einer vollständigen Definitionsaussage verwendet werden, bei der die vollständige Definition des Begriffs eine der folgenden sein kann:

  • Der übergeordnete Absatz (ein Textblock, manchmal markiert durch ein <p>-Element)
  • Die <dt>/<dd>-Paarung
  • Der nächste Abschnitt des <dfn>-Elements,

Probieren Sie es aus

<p> A <dfn id="def-validator">validator</dfn> is a program that checks for syntax errors in code or documents. </p> 
dfn { /* Add your styles here */ }

Attribute

Zu den Attributen dieses Elements gehören die globalen Attribute.

Das title-Attribut hat eine besondere Bedeutung, wie unten beschrieben.

Verwendungshinweise

Es gibt einige nicht ganz offensichtliche Aspekte bei der Verwendung des <dfn>-Elements. Wir untersuchen diese hier.

Angabe des zu definierenden Begriffs

Der zu definierende Begriff wird anhand der folgenden Regeln identifiziert:

  1. Wenn das <dfn>-Element ein title-Attribut hat, wird der Wert des title-Attributs als der zu definierende Begriff angesehen. Das Element muss dennoch Text enthalten, aber dieser Text kann eine Abkürzung sein (vielleicht unter Verwendung von <abbr>) oder eine andere Form des Begriffs.
  2. Wenn das <dfn>-Element ein einzelnes Kindelement enthält und keinen eigenen Textinhalt hat, und das Kindelement ein <abbr>-Element mit einem title-Attribut ist, dann ist der exakte Wert des title des <abbr>-Elements der definierte Begriff.
  3. Andernfalls ist der Textinhalt des <dfn>-Elements der zu definierende Begriff. Dies wird im ersten Beispiel unten gezeigt.

Hinweis: Wenn das <dfn>-Element ein title-Attribut hat, muss es den zu definierenden Begriff und keinen anderen Text enthalten.

Wenn Sie ein id-Attribut am <dfn>-Element hinzufügen, können Sie mit <a>-Elementen darauf verlinken. Solche Links sollten Verwendungen des Begriffs sein, mit der Absicht, dass der Leser schnell zur Definition des Begriffs navigieren kann, falls er damit nicht bereits vertraut ist, indem er auf den Link des Begriffs klickt.

Dies wird im Beispiel unter Links zu Definitionen unten gezeigt.

Beispiele

Sehen wir uns einige Beispiele für verschiedene Nutzungsszenarien an.

Grundlegende Identifizierung eines Begriffs

Dieses Beispiel verwendet ein einfaches <dfn>-Element, um die Position eines Begriffs innerhalb der Definition zu identifizieren.

HTML

html
<p> The <strong>HTML Definition element (<dfn>&lt;dfn&gt;</dfn>)</strong> is used to indicate the term being defined within the context of a definition phrase or sentence. </p>

Da das <dfn>-Element kein title hat, werden die Textinhalte des <dfn>-Elements selbst als der zu definierende Begriff verwendet.

Ergebnis

Um Links zu den Definitionen hinzuzufügen, erstellen Sie den Link so, wie Sie es immer mit dem <a>-Element tun.

HTML

html
<p> The <strong>HTML Definition element (<dfn id="definition-dfn">&lt;dfn&gt;</dfn>)</strong> is used to indicate the term being defined within the context of a definition phrase or sentence. </p> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Graece donan, Latine voluptatem vocant. Confecta res esset. Duo Reges: constructio interrete. Scrupulum, inquam, abeunti; </p> <p> Because of all of that, we decided to use the <code><a href="#definition-dfn">&lt;dfn&gt;</a></code> element for this project. </p>

Hier sehen wir die Definition – jetzt mit einem id-Attribut, "definition-dfn", das als Ziel eines Links verwendet werden kann. Später wird ein Link erstellt, indem das <a>-Element mit dem href-Attribut auf "#definition-dfn" gesetzt wird, um den Link zurück zur Definition einzurichten.

Ergebnis

Verwendung von Abkürzungen und Definitionen zusammen

In einigen Fällen möchten Sie möglicherweise eine Abkürzung für einen Begriff verwenden, wenn Sie ihn definieren. Dies kann erreicht werden, indem die <dfn>- und <abbr>-Elemente zusammen verwendet werden, wie folgt:

HTML

html
<p> The <dfn><abbr title="Hubble Space Telescope">HST</abbr></dfn> is among the most productive scientific instruments ever constructed. It has been in orbit for over 20 years, scanning the sky and returning data and photographs of unprecedented quality and detail. </p> <p> Indeed, the <abbr title="Hubble Space Telescope">HST</abbr> has arguably done more to advance science than any device ever built. </p>

Beachten Sie das <abbr>-Element, das innerhalb des <dfn>-Elements eingebettet ist. Ersteres legt fest, dass der Begriff eine Abkürzung ("HST") ist, und gibt den vollständigen Begriff ("Hubble Space Telescope") in seinem title-Attribut an. Letzteres zeigt an, dass der abgekürzte Begriff einen definierten Begriff darstellt.

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Flussinhalt, Phraseninhalt, fühlbarer Inhalt.
Erlaubter Inhalt Phraseninhalt, aber kein <dfn>-Element darf ein Nachkomme sein.
Tag-Auslassung Keine, sowohl der Anfangs- als auch der End-Tag sind obligatorisch.
Erlaubte Eltern Jedes Element, das Phraseninhalt akzeptiert.
Implizite ARIA-Rolle term
Erlaubte ARIA-Rollen Beliebig
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML
# the-dfn-element

Browser-Kompatibilität

Siehe auch