← 返回首页
<dfn> HTML-Definitionselement - HTML | MDN
HTML

HTML: Markup language

HTML reference HTML guides Markup languages
CSS

CSS: Styling language

CSS reference CSS guides Layout cookbook
JavaScriptJS

JavaScript: Scripting language

JS reference JS guides
Web APIs

Web APIs: Programming interfaces

Web API reference Web API guides
All

All web technology

Technologies Topics
Learn

Learn web development

Frontend developer course Learn HTML Learn CSS Learn JavaScript
Tools

Discover our tools

About

Get to know MDN better

Blog
Seitenleiste umschalten
  1. Web
  2. HTML
  3. Reference
  4. Elements
  5. <dfn>
Farbschema
  • Systemeinstellung
  • Hell
  • Dunkel
Deutsch
Sprache merken Mehr erfahren

Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

<dfn> HTML-Definitionselement

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.

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, der manchmal durch ein <p>-Element gekennzeichnet ist)
  • Das <dt>/<dd>-Paar
  • Der nächstgelegene Abschnitt, der Vorfahre des <dfn>-Elements ist,

In diesem Artikel

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

Die Attribute dieses Elements umfassen die globalen Attribute.

Das title-Attribut hat eine besondere Bedeutung, wie unten aufgeführt.

Nutzungshinweise

Es gibt einige nicht ganz offensichtliche Aspekte bei der Verwendung des <dfn>-Elements. Diese betrachten wir hier.

Festlegen des zu definierenden Begriffs

Der zu definierende Begriff wird anhand dieser 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 weiterhin Text enthalten, aber dieser Text kann eine Abkürzung (möglicherweise mit <abbr>) oder eine andere Form des Begriffs sein.
  2. Wenn das <dfn> ein einzelnes Kindelement enthält und keinen eigenen Textinhalt hat und das Kindelement ein <abbr>-Element mit einem eigenen title-Attribut ist, dann ist der genaue Wert des title-Attributs des <abbr>-Elements der zu definierende 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 im <dfn>-Element einfügen, können Sie dann 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, wenn er nicht bereits darüber Bescheid weiß, indem er auf den Link des Begriffs klickt.

Dies wird im Beispiel unter Links zu Definitionen unten gezeigt.

Beispiele

Sehen wir uns einige Beispiele verschiedener Nutzungsszenarien an.

Grundlegende Identifikation eines Begriffs

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

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 ebenso wie immer mit dem <a>-Element.

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 mit <a> erstellt, wobei das href-Attribut auf "#definition-dfn" gesetzt wird, um den Link zurück zur Definition herzustellen.

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 durch die Verwendung der <dfn>- und <abbr>-Elemente im Tandem erfolgen, 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 innerhalb des <dfn>-Elements verschachtelte <abbr>-Element. Ersteres stellt fest, dass der Begriff eine Abkürzung ("HST") ist, und spezifiziert den vollständigen Begriff ("Hubble Space Telescope") in seinem title-Attribut. Letzteres zeigt an, dass der abgekürzte Begriff einen zu definierenden Begriff darstellt.

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Zulässiger Inhalt Tag-Auslassung Zulässige Eltern Implizierte ARIA-Rolle Zulässige ARIA-Rollen DOM-Schnittstelle
Fließender Inhalt, Textsegmentinhalt, fühlbarer Inhalt.
Textsegmentinhalt, aber kein <dfn>-Element darf ein Nachkomme sein.
Keine, sowohl der Start- als auch der End-Tag sind obligatorisch.
Jedes Element, das Textsegmentinhalt akzeptiert.
term
Beliebig
[`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Spezifikation
HTML
# the-dfn-element

Browser-Kompatibilität

JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.

Siehe auch

Help improve MDN

War diese Übersetzung hilfreich?
Ja Nein
Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.
Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden
  1. HTML
  2. Anleitungen
    1. Cheatsheet
    2. Comments
    3. Constraint validation
    4. Inhaltskategorien
    5. Datums- und Zeitformate
    6. Microdata
    7. Microformats
    8. Quirks- und Standardsmodi
    9. Responsive Bilder
  3. Anleitung
  4. Begriffe mit HTML definieren
  5. Verwendung von data-Attributen
  6. Verwendung von Cross-Origin-Bildern
  7. Platzieren Sie eine Hitmap auf einem Bild
  8. Schnelle HTML-Seiten erstellen
  9. JavaScript hinzufügen
  10. Referenzen
  11. Elemente
    1. <a>
    2. <abbr>
    3. <acronym>
    4. <address>
    5. <area>
    6. <article>
    7. <aside>
    8. <audio>
    9. <b>
    10. <base>
    11. <bdi>
    12. <bdo>
    13. <big>
    14. <blockquote>
    15. <body>
    16. <br>
    17. <button>
    18. <canvas>
    19. <caption>
    20. <center>
    21. <cite>
    22. <code>
    23. <col>
    24. <colgroup>
    25. <data>
    26. <datalist>
    27. <dd>
    28. <del>
    29. <details>
    30. <dfn>
    31. <dialog>
    32. <dir>
    33. <div>
    34. <dl>
    35. <dt>
    36. <em>
    37. <embed>
    38. <fencedframe>
    39. <fieldset>
    40. <figcaption>
    41. <figure>
    42. <font>
    43. <footer>
    44. <form>
    45. <frame>
    46. <frameset>
    47. <geolocation>
    48. <h1>–<h6>
    49. <head>
    50. <header>
    51. <hgroup>
    52. <hr>
    53. <html>
    54. <i>
    55. <iframe>
    56. <img>
    57. <input>
    58. <ins>
    59. <kbd>
    60. <label>
    61. <legend>
    62. <li>
    63. <link>
    64. <main>
    65. <map>
    66. <mark>
    67. <marquee>
    68. <menu>
    69. <meta>
    70. <meter>
    71. <nav>
    72. <nobr>
    73. <noembed>
    74. <noframes>
    75. <noscript>
    76. <object>
    77. <ol>
    78. <optgroup>
    79. <option>
    80. <output>
    81. <p>
    82. <param>
    83. <picture>
    84. <plaintext>
    85. <pre>
    86. <progress>
    87. <q>
    88. <rb>
    89. <rp>
    90. <rt>
    91. <rtc>
    92. <ruby>
    93. <s>
    94. <samp>
    95. <script>
    96. <search>
    97. <section>
    98. <select>
    99. <selectedcontent>
    100. <slot>
    101. <small>
    102. <source>
    103. <span>
    104. <strike>
    105. <strong>
    106. <style>
    107. <sub>
    108. <summary>
    109. <sup>
    110. <table>
    111. <tbody>
    112. <td>
    113. <template>
    114. <textarea>
    115. <tfoot>
    116. <th>
    117. <thead>
    118. <time>
    119. <title>
    120. <tr>
    121. <track>
    122. <tt>
    123. <u>
    124. <ul>
    125. <var>
    126. <video>
    127. <wbr>
    128. <xmp>
  12. Attribute
    1. accept
    2. autocomplete
    3. capture
    4. content
    5. crossorigin
    6. dirname
    7. disabled
    8. elementtiming
    9. fetchpriority
    10. for
    11. form
    12. integrity
    13. max
    14. maxlength
    15. min
    16. minlength
    17. multiple
    18. pattern
    19. placeholder
    20. readonly
    21. rel
    22. required
    23. size
    24. step
  13. Globale Attribute
    1. accesskey
    2. anchor
    3. autocapitalize
    4. autocorrect
    5. autofocus
    6. class
    7. contenteditable
    8. data-*
    9. dir
    10. draggable
    11. enterkeyhint
    12. exportparts
    13. hidden
    14. id
    15. inert
    16. inputmode
    17. is
    18. itemid
    19. itemprop
    20. itemref
    21. itemscope
    22. itemtype
    23. lang
    24. nonce
    25. part
    26. popover
    27. slot
    28. spellcheck
    29. style
    30. tabindex
    31. title
    32. translate
    33. virtualkeyboardpolicy
    34. writingsuggestions
  14. Attributes by element
    1. <input>-Typen
      1. <input type="button">
      2. <input type="checkbox">
      3. <input type="color">
      4. <input type="date">
      5. <input type="datetime-local">
      6. <input type="email">
      7. <input type="file">
      8. <input type="hidden">
      9. <input type="image">
      10. <input type="month">
      11. <input type="number">
      12. <input type="password">
      13. <input type="radio">
      14. <input type="range">
      15. <input type="reset">
      16. <input type="search">
      17. <input type="submit">
      18. <input type="tel">
      19. <input type="text">
      20. <input type="time">
      21. <input type="url">
      22. <input type="week">
    2. <script type>
      1. importmap
      2. speculationrules
    3. <meta name>
      1. color-scheme
      2. referrer
      3. robots
      4. text-scale
      5. theme-color
      6. viewport
    4. <meta http-equiv>
  15. Attribute values
    1. <link rel> keywords
      1. alternatives Stylesheet
      2. compression-dictionary
      3. dns-prefetch
      4. manifest
      5. me
      6. modulepreload
      7. noopener
      8. noreferrer
      9. preconnect
      10. prefetch
      11. preload
      12. prerender

Der Bauplan für ein besseres Internet.

MDN Mitmachen Entwicklung

Besuche die gemeinnützige Muttergesellschaft der Mozilla Corporation, die Mozilla Foundation.
Teile dieses Inhalts sind ©1998–2026 von einzelnen mozilla.org-Mitwirkenden. Inhalte sind verfügbar unter einer Creative-Commons-Lizenz.