L'élément HTML <dfn> est utilisé afin d'indiquer le terme qui est en train d'être défini dans une phrase ou un paragraphe (sa définition est écrite dans son parent <p> ou <dt>/<dd> ou <section> le plus proche).

Note : Si cette phrase vous paraît absconse, n'hésitez pas à consulter les exemples ci-après.

Le rôle de l'élément <dfn> est purement sémantique.

Catégories de contenu Contenu de flux, contenu phrasé, contenu tangible.
Contenu autorisé Contenu phrasé mais sans élément <dfn> qui soit un descendant.
Omission de balises Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires
Parents autorisés Tout élément acceptant du contenu phrasé.
Rôles ARIA autorisés Tous les rôles sont autorisés.
Interface DOM HTMLElement.

Attributs

Comme pour tous les éléments, on peut appliquer les attributs universels sur <dfn>.

Pour cet élément, l'attribut title possède un sens particulier noté ci-après.

Notes d'utilisation :

  • L'élément <dfn> marque le terme étant défini. La définition du terme doit être donnée par l'élément <p>, ou <section> parent ou par un groupe de liste de définitions (généralement une paire <dt>, <dd>).
  • La valeur exacte du terme étant défini est déterminé par les règles suivantes :
    1. Si l'élément <dfn> possède un attribut title alors le terme en question est la valeur de cet attribut. Dans ce cas, l'élément doit toujours contenir du texte mais ce dernier peut être une autre forme du terme (par exemple une abbréviation, auquel cas on utilisera un élément <abbr>)
    2. Sinon et s'il contient seulement un élément <abbr> avec l'attribut title, alors le terme en question est la valeur de cet attribut.
    3. Dans tous les autres cas, le texte contenu par l'élément <dfn> est le terme qui est défini.

Exemples

Identification simple d'un terme

Dans cet exemple, on utilise simplement l'élément <dfn> afin d'identifier l'emplacement du terme défini au sein de sa définition.

HTML

<p>
  L'élément HTML de définition 
  (<strong><dfn>&lt;dfn&gt;</dfn></strong>) est 
  utilisé afin d'indiquer le terme en cours de 
  définition dans la phrase.
</p>

L'élément <dfn> n'ayant ici pas d'attribut title, c'est le contenu textuel qui représente le terme que l'on définit.

Résultat

Liens vers des définitions

Il est possible d'utiliser l'attribut id afin de créer des liens avec des éléments <a> qui pointent vers la définition.

HTML

<p>L'élément de définition
(<strong><dfn id="definition-dfn">&lt;dfn&gt;</dfn></strong>) est
utilisé afin d'indiquer le terme en train d'être défini dans le 
contexte d'une phrase.</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>Negare non possum. Dat enim intervalla et relaxat. Quonam modo?
Equidem e Cn. Quid de Pythagora? In schola desinis. </p>

<p>Ubi ut eam caperet aut quando? Cur iustitia laudatur? Aperiendum
est igitur, quid sit voluptas; Quid enim? Non est igitur voluptas
bonum. Urgent tamen et nihil remittunt. Quid enim possumus hoc
agere divinius? </p>

<p>C'est pourquoi nous avons décidé d'utiliser l'élément
<code><a href="#definition-dfn">&lt;dfn&gt;</a></code> pour
ce projet.</p>

On voit ici que l'élément possède désormais un attribut id avec la valeur "definition-dfn". Cet attribut permet d'utiliser l'élément comme cible d'un lien. Plus bas, on crée un tel lien avec un élément <a> dont l'attribut href vaut "#definition-dfn", ce qui permet de remonter à la définition.

Résultat

Combiner les abbréviations et les définitions

Dans certains cas, on souhaite utiliser l'abbréviation d'un terme lorsqu'on le définit. Pour cela, on peut utiliser <dfn> et <abbr> de la façon suivante :

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>

On notera que l'élément <abbr> est imbriqué dans l'élément <dfn>. L'élément <abbr> indique que le terme est une abbréviation ("HST") et indique le détail de cette abbrévation ("Hubble Space Telescope") grâce à son attribut  title. L'élément <dfn> indique quant à lui que c'est bien ce terme abrégé qu'on est en train de définir.

Résultat

Spécifications

Spécifications État Commentaires
HTML Living Standard
La définition de '<dfn>' dans cette spécification.
Standard évolutif  
HTML5
La définition de '<dfn>' dans cette spécification.
Recommendation  
HTML 4.01 Specification
La définition de '<dfn>' dans cette spécification.
Recommendation  

Compatibilité des navigateurs

FonctionnalitéChromeEdgeFirefoxInternet ExplorerOperaSafari
Support simple Oui Oui1 Oui Oui Oui
FonctionnalitéAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Support simple Oui Oui Oui4 Oui Oui Oui

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
Contributeurs à cette page : SphinxKnight, marie-ototoi, tregagnon
Dernière mise à jour par : SphinxKnight,