recursal/MDN huggingface dataset:
<menu> : l'élément de menu
==========================

L'élément HTML **`<menu>`** est une alternative sémantique à `<ul>`, mais est traité par les navigateurs, et en termes d'accessibilité comme un élément `<ul>`. Il représente une liste d'éléments non-ordonnée (chaque élément de la liste étant représenté par un élément `<li>`).

Attributs
---------

Cet élément inclut uniquement les attributs universels.

Notes d'utilisation
-------------------

Les éléments `<menu>` et `<ul>` représentent tous les deux une liste non-ordonnée d'éléments. `<ul>` doit être utilisés pour des éléments qui doivent uniquement être affichés alors que `<menu>` était initialement conçu pour des éléments interactifs.

L'élément connexe `<menuitem>` a été déprécié.

**Note :** Dans d'anciennes versions de la spécification HTML, l'élément `<menu>` pouvait être utilisé pour représenter un menu contextuel. Cette fonctionnalité est désormais considérée comme obsolète et ne fait plus partie de la spécification.

Exemples
--------

### Barre d'outils

Dans cet exemple, on utilise un élément `<menu>` afin de créer une barre d'outils pour une application d'édition.

#### HTML


```html
<menu>
  <li><button onclick="copy()">Copier</button></li>
  <li><button onclick="cut()">Couper</button></li>
  <li><button onclick="paste()">Coller</button></li>
</menu>
```


On notera que, sur le plan fonctionnel, cela est équivalent à :


```html
<ul>
  <li><button onclick="copy()">Copier</button></li>
  <li><button onclick="cut()">Couper</button></li>
  <li><button onclick="paste()">Coller</button></li>
</ul>
```


#### CSS


```css
menu,
ul {
  display: flex;
  list-style: none;
  padding: 0;
  width: 400px;
}

li {
  flex-grow: 1;
}

button {
  width: 100%;
}
```


#### Résultat

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux et contenu tangible si au moins un enfant du menu est un élément `<li>`. |
| Contenu autorisé | Zéro ou plusieurs occurrences de `<li>`, `<script>`, et `<template>` |
| Omission de balises | Aucune balise ne doit être omise |
| Parents autorisés | Tout élément qui accepte du contenu de flux. |
| Rôle ARIA implicite | `list` (en-US) |
| Rôles ARIA autorisés | `directory`, `group`, `listbox`, `menu`, `menubar`, `none`, `presentation`, `radiogroup`, `tablist`, `toolbar` ou `tree` |
| Interface DOM | `HTMLMenuElement` (en-US) |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-menu-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les autres éléments HTML relatifs aux listes :
    + `<ol>`
    + `<ul>`
    + `<li>`
<map>
=====

L'élément HTML **`<map>`** est utilisé avec des éléments `<area>` afin de définir une image cliquable divisée en régions.

Exemple interactif
------------------

Attributs
---------

Comme tous les autres éléments HTML, cet élément inclut les attributs universels.

`name`

Cet attribut fournit un nom afin que la carte cliquable puisse être référencée. Cet attribut est obligatoire et sa valeur doit être une chaîne de caractères non-vide qui ne contient pas de blancs. La valeur de cet attribut doit être unique pour tous les éléments `<map>` du document. Si l'attribut universel `id` est utilisé, `name` devra avoir la même valeur que celui-ci.

Exemples
--------

### HTML


```html
<map name="primary">
  <area shape="circle" coords="75,75,75" href="left.html" />
  <area shape="circle" coords="275,75,75" href="right.html" />
</map>
<img
 usemap="#primary"
 src="https://via.placeholder.com/350x150"
 alt="350 x 150 pic" />
```

### Résultat

### Résultat attendu

L'exemple précédent devrait faire apparaître des images semblables (en utilisant la touche `tab` de votre clavier) :

*Pour le lien `left.html` :*
![](/fr/docs/Web/HTML/Element/map/screen_shot_2017-02-02_at_10.48.40_pm.png)

*Pour le lien `right.html` :*
![](/fr/docs/Web/HTML/Element/map/screen_shot_2017-02-02_at_10.49.04_pm.png)

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 contenu phrasé,
 contenu tangible.
  |
| Contenu autorisé | 
 Tout élément dont
 le modèle de contenu est transparent.
  |
| Omission de balises | Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires |
| Parents autorisés | 
 Tout élément qui accepte
 du contenu phrasé.
  |
| Rôles ARIA autorisés | Aucun. |
| Interface DOM | `HTMLMapElement` (en-US) |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-map-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `<a>`
* `<area>`
<dir> : l'élément de répertoire
===============================

**Attention :** Cette fonctionnalité est obsolète. Bien qu'encore supportée par des navigateurs, son utilisation est découragée pour tout nouveau projet. Évitez de l'utiliser.

L'élément HTML **`<dir>`** (pour *directory*) est utilisé comme un conteneur pour un répertoire (c'est-à-dire un ensemble de fichiers). Des styles et icônes peuvent être appliqués par l'agent utilisateur. Cet élément obsolète ne doit pas être utilisé, il peut être remplacé par l'élément `<ul>` qui permet de représenter des listes et, entre autres, des listes de fichiers.

**Attention :** Cet élément ne doit pas être utilisé. Bien que présent dans les premières spécifications HTML, il a été déprécié dans HTML 4, et rendu obsolète avec HTML5. Il faudra privilégier l'élément `<ul>`. De plus, aucun navigateur majeur ne prend en charge cet élément.

Interface DOM
-------------

Cet élément implémente l'interface `HTMLDirectoryElement`.

Attributs
---------

Comme pour tous les autres éléments HTML, on peut utiliser les attributs universels sur cet élément.

`compact`

Cet attribut booléen indique que la liste doit être rendue avec un affichage compact. L'interprétation de cet attribut dépend de l'agent utilisateur. Il ne fonctionne pas dans tous les navigateurs.

**Attention :** Cet attribut ne doit pas être utilisé, car il a été déprécié. L'élément `<dir>` doit être mis en forme en utilisant CSS. Pour obtenir un effect visuel similaire à l'attribut `compact`, la propriété CSS `line-height` peut être utilisé avec la valeur `80%`.

Spécifications
--------------

Ne fait pas partie des spécifications actuelles.

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les autres éléments HTML utilisés pour les listes : `<ol>`, `<ul>`, `<li>`, and `<menu>`;
* Les propriétés CSS qui peuvent être utilisées pour mettre en forme l'élément `<dir>` :
    + La propriété `list-style` est utile pour choisir l'apparence des puces.
    + Les compteurs CSS sont utiles pour gérer des listes imbriquées complexes.
    + La propriété `line-height` est utile pour reproduire l'attribut déprécié `compact`.
    + La propriété `margin` est utile pour contrôler l'indentation de la liste.
<hgroup>
========

L'élément HTML **`<hgroup>`** représente un titre et son contenu associé. Il regroupe un élément `<h1>-<h6>` avec un ou plusieurs paragraphes `<p>`.

Exemple interactif
------------------

Attributs
---------

Cet élément inclut uniquement les attributs universels.

Notes d'utilisation
-------------------

L'élément `<hgroup>` permet de regrouper le titre principal d'une section avec du contenu secondaire associé, tel que son (ou ses) sous-titre(s), un titre alternatif ou un slogan. Chaque contenu de ce type sera représenté par un élément `<p>` au sein de l'élément `<hgroup>`.

L'élément `<hgroup>` en tant que tel n'a pas d'effet sur le plan (*outline*) d'une page web. C'est le titre intégré au sein de l'élément `<hgroup>` qui contribue au plan du document.

Exemples
--------


```html
<hgroup id="document-title">
  <h1>HTML : standard évolutif</h1>
  <p>Dernière mise à jour le 12 juillet 2022</p>
</hgroup>
<p>Une introduction dans le document.</p>
<h2>Table des matières</h2>
<ol id="toc">
  …
</ol>
<h2>Première section</h2>
<p>Une introduction à la première section.</p>
```

### Résultat

Accessibilité
-------------

L'élément `<hgroup>` n'a pas de sémantique forte pour l'accessibilité. C'est le contenu de l'élément (le titre et les éventuels paragraphes) qui sont exposés aux API d'accessibilité du navigateur.

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux, contenu de titre, contenu tangible. |
| Contenu autorisé | Zéro ou plusieurs éléments `<p>`, suivi par un élément de titre (`<h1-6>`), suivis par zéro ou plusieurs éléments `<p>`. |
| Omission de balise | Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires |
| Parents autorisés | Tout élément qui accepte du contenu de flux. |
| Rôle ARIA implicite | Aucun rôle correspondant |
| Rôles ARIA autorisés | Tous |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-hgroup-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les autres éléments HTML relatifs aux sections du document :
    + `<body>`
    + `<article>`
    + `<section>`
    + `<aside>`
    + `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>`, `<h6>`
    + `<nav>`
    + `<header>`
    + `<footer>`
    + `<address>`
* Sections et plan d'un document HTML
<var> : l'élément de variable
=============================

L'élément HTML **`<var>`** représente une variable dans une expression mathématique ou un texte lié à la programmation. Son contenu est généralement représenté avec une version italique de la police environnante utilisée, toutefois, ce comportement peut dépendre du navigateur utilisé.

Exemple interactif
------------------

Attributs
---------

Cet élément inclut les attributs universels.

Notes d'utilisation
-------------------

### Éléments associés

Voici d'autres éléments qui sont fréquemment utilisés dans les contextes où `<var>` est utilisé :

* `<code>`
* `<kbd>`
* `<samp>`

Si vous trouvez un élément `<var>` utilisé uniquement pour la mise en forme, il est préférable de remplacer celui-ci par un élément `<span>` auquel on appliquera les règles CSS souhaitées.

### Mise en forme par défaut

La plupart des navigateurs appliquent la propriété `font-style` avec la valeur `"italic"` lors de l'affichage d'un élément `<var>`. Ce comportement peut être surchargé par la feuille de style CSS du site :


```css
var {
  font:
    bold 15px "Courier",
    "Courier New",
    monospace;
}
```

Exemples
--------

### Exemple simple

#### HTML


```html
<p>
  Une équation simple :
  <var>x</var> = <var>y</var> + 2
</p>
```


#### Résultat

### Surcharger la mise en forme par défaut

#### CSS


```css
var {
  font:
    bold 15px "Courier",
    "Courier New",
    monospace;
}
```


#### HTML


```html
<p>
  Les variables <var>minSpeed</var> et <var>maxSpeed</var> contrôlent les
  vitesses minimale et maximale de l'appareil et sont exprimées en tours par
  minute.
</p>
```


#### Résultat

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 contenu phrasé,
 contenu tangible.
  |
| Contenu autorisé | Contenu phrasé. |
| Omission de balises | Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires |
| Parents autorisés | 
 Tout élément qui accepte du
 contenu phrasé.
  |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-var-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
<xmp>
=====

**Obsolète:** Cette fonctionnalité a été supprimée des standards du Web. Bien que quelques navigateurs puissent encore la supporter, elle est en cours d'éradication. Ne l'utilisez ni dans d'anciens projets, ni dans de nouveaux. Les pages et applications Web l'utilisant peuvent cesser de fonctionner à tout moment.

L'élément HTML **`<xmp>`** (pour *example*) affiche le texte entre les balises d'ouverture et de fermeture sans interpréter le HTML qu'il contient et en utilisant une police à chasse fixe. La spécification HTML 2 recommande un affichage suffisamment large pour contenir 80 caractères par ligne.

**Note :** Ne pas utiliser cet élément.

* Il a été déprécié depuis HTML3.2 et n'a pas été implémenté d'une manière cohérente. Il a été complètement retiré du langage dans HTML5.
* Utilisez l'élément `<pre>` ou, si sémantiquement approprié, l'élément `<code>`. Notez qu'il vous faudra échapper les caractères '`<`' et '`>`' pour qu'ils ne soient pas interprétés.
* Une police à chasse fixe peut être obtenu sur n'importe quel élément en utilisant des règles CSS, par la valeur `monospace` avec la propriété `font-family`.

Attributs
---------

Cet élément n'a aucun autre attribut en dehors des attributs universels, communs à tous les éléments.

Interface DOM
-------------

Cet élément implémente l'interface `HTMLElement`.

**Note :** Jusqu'à Gecko 1.9.2 inclus, Firefox implémentait l'interface `HTMLSpanElement` pour cet élément.

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les éléments `<pre>` et `<code>` qui doivent être utilisés à la place.
* Les éléments `<plaintext>` et `<listing>`, similaires à `<xmp>` mais également obsolètes.
<figcaption> : l'élément de légende d'une figure
================================================

L'élément HTML **`<figcaption>`** représente une légende décrivant le reste du contenu de son élément parent `<figure>`.

Exemple interactif
------------------

|  |  |
| --- | --- |
| Catégories de contenu | Aucune. |
| Contenu autorisé | Contenu de flux. |
| Omission de balises | 
 Aucune, la balise d'ouverture et la balise de fermeture sont
 obligatoires
  |
| Parents autorisés | 
 Un élément
 `<figure>`, l'élément `<figcaption>` doit être le premier ou le
 dernier élément fils pour cet élément `<figure>`.
  |
| Rôle ARIA implicite | Pas de rôle correspondant |
| Rôles ARIA autorisés | `group`, `none`,
 `presentation` |
| Interface DOM | `HTMLElement` |

Attributs
---------

Cet élément prend uniquement en charge les attributs universels.

Exemple
-------

Veuillez consulter la page `<figure>` pour des exemples sur `<figcaption>`.

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-figcaption-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'élément `<figure>`
<rb> : l'élément de base ruby
=============================

L'élément de **base ruby (`<rb>`)** est utilisé afin de délimiter le composant texte de base d'une annotation `<ruby>`. Autrement dit, le texte qui est annoté. Un élément `<rb>` devrait encadrer chaque segment atomique du texte de base.

Attributs
---------

Seuls les attributs universels peuvent être utilisés sur cet élément.

Notes d'utilisation
-------------------

* Les annotations ruby sont utilisées afin d'afficher la prononciation pour les caractères d'Asie orientale tels que les caractères japonais furigana ou les caractères taïwanais bopomofo. L'élément `<rb>` permet de séparer chaque segment du texte de base ruby.
* Bien que `<rb>` ne soit pas un élément vide, il est courant de n'inclure que la balise d'ouverture de chaque élément afin de simplifier le balisage dédié aux annotations ruby.
* Il faut inclure un élément `<rt>` pour chaque segment de base `<rb>` qu'on souhaite annoter.
Exemples
--------

Dans cet exemple, on fournit une annotation pour le caractère original correspondant à "Kanji" :


```html
<ruby>
  <rb>漢</rb><rb>字 </rb><rp>(</rp><rt>kan</rt><rt>ji</rt><rp>)</rp>
</ruby>
```

### Résultat

On voit ici que deux éléments `<rb>` sont inclus et permettent de délimiter les deux segments du texte de base. Pour l'annotation, chaque partie correspondante est délimitée par un élément `<rt>`.

On aurait également pu écrire cet exemple avec les deux parties du texte de base complètement séparées. Dans ce cas, il n'aurait pas été nécessaire d'inclure les éléments `<rb>` :


```html
<ruby>
  漢 <rp>(</rp><rt>Kan</rt><rp>)</rp> 字 <rp>(</rp><rt>ji</rt><rp>)</rp>
</ruby>
```


#### Résultat

### Avec prise en charge de ruby
```

<ruby>
  <rb>漢</rb><rb>字 </rb><rp>(</rp><rt>kan</rt><rt>ji</rt><rp>)</rp>
</ruby>
```


```
body {
  font-size: 22px;
}
```


#### Résultat

Pour un navigateur qui ne prend pas en charge les annotations ruby, voici à quoi aurait ressemblé le résultat :

### Sans prise en charge de ruby
```

漢字 (kan ji)
```


```
body {
  font-size: 22px;
}
```


#### Résultat

**Note :** Voir l'article sur l'élément `<ruby>` pour de plus amples exemples.

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Aucune. |
| Contenu autorisé | 
 Cet élément peut être l'élément fils d'un élément
 `<ruby>`.
  |
| Omission de balise | 
 La balise de fin peut être omise si l'élément est immédiatement suivi
 d'un élément `<rt>`, `<rtc>`
 ou `<rp>` ou encore par un autre élément
 `<rb>` ou s'il n'y a plus de contenu dans l'élément
 parent.
  |
| Éléments parents autorisés | Un élément `<ruby>`. |
| Rôles ARIA autorisés | N'importe quel rôle |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # rb |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `<ruby>`
* `<rt>`
* `<rp>`
* `<rtc>`
<data> : l'élément de données
=============================

L'élément HTML **`<data>`** relie un contenu à une version de ce contenu interprétable par un ordinateur. Si le contenu possède une composante temporelle, l'élément `<time>` doit être utilisé.

Exemple interactif
------------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 contenu phrasé,
 contenu tangible.
  |
| Contenu autorisé | Contenu phrasé. |
| Omission de balises | 
 Aucune, la balise d'ouverture et la balise de fermeture sont
 obligatoires.
  |
| Éléments parents autorisés | 
 Tout élément acceptant du
 contenu phrasé.
  |
| Rôle ARIA implicite | Pas de rôle correspondant |
| Rôles ARIA autorisés | Tous les rôles. |
| Interface DOM | `HTMLDataElement` (en-US) |

Attributs
---------

Comme pour tous les autres éléments, on peut utiliser les attributs universels sur `<data>`.

`value`

Cet attribut définit la version du contenu qui doit être interprétée par une machine.

Exemples
--------

Dans l'exemple suivant, on affiche des noms de produits avec des codes correspondants :


```html
<p>Nouveaux produits</p>
<ul>
  <li><data value="3251546">Mini voiture</data></li>
  <li><data value="5867654">Grande voiture</data></li>
  <li><data value="9887635">Énorme voiture</data></li>
</ul>
```

### Résultat

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-data-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'élément `<time>`.
<small>
=======

L'élément HTML **`<small>`** permet de représenter des commentaires ou des textes à écrire en petits caractères (des termes d'un contrat, des mentions relatives au droit d'auteur, etc.) quelle que soit la présentation.

Exemple interactif
------------------

Attributs
---------

Cet élément inclut uniquement les attributs universels.

Exemples
--------

### HTML


```html
<p>
  Voici une phrase avant des infos à présenter en plus petit.
  <small>© tous droits réservés</small>
</p>
```

### Résultat

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 contenu phrasé.
  |
| Contenu autorisé | Contenu phrasé. |
| Omission de balises | 
 Aucune, la balise ouvrante et la balise fermante doivent toutes les deux
 être présentes.
  |
| Parents autorisés | 
 Tout élément qui accepte du
 contenu phrasé
 ou tout élément qui accepte du
 contenu de flux.
  |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-small-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Notes
-----

Bien que l'élément `<small>` et les éléments `<b>` et `<i>` soient souvent considérés comme allant à l'encontre du découpage structure/présentation, ils sont tous valides en HTML5. Les auteurs doivent appliquer leur esprit critique afin de déterminer s'il est préférable d'employer `<small>` ou des règles CSS.

Voir aussi
----------

* `<b>`
* `<font>`
* `<style>`
<head> : l'élément de métadonnées (en-tête) du document
=======================================================

L'élément HTML **<head>** fournit des informations générales (métadonnées) sur le document, incluant son titre et des liens ou des définitions vers des scripts et feuilles de style.

**Note :** L'élément `<head>` contient principalement des données destinées au traitement automatisé et pas nécessairement lisibles par des humains. Pour afficher des informations lisibles pour les utilisateurs dans des en-têtes ou titre, voir l'élément `<header>`.

Attributs
---------

Comme tous les éléments HTML, cet élément prend en charge les attributs universels.

`profile`
Obsolète

L'URI d'un ou plusieurs profils de métadonnées, séparés par un espace.

Exemples
--------


```html
<html>
  <head>
    <title>Titre du document</title>
  </head>
</html>
```

Notes
-----

La plupart des navigateurs conformes à HTML5 construisent automatiquement l'élément `<head>` si les balises sont omises dans le balisage. Cependant, ce comportement n'est pas garanti pour les navigateurs antérieurs.

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Aucune |
| Contenu autorisé | 
 Si le document est un document source
 (`srcdoc`) d'une
 `<iframe>` ou si l'information pour le titre est
 disponible via un protocole de plus haut niveau zéro ou plusieurs
 éléments de méta-données.Sinon un ou plusieurs éléments de
 méta-données dont un (et un seul) est un élément
 `<title>`.
  |
| Omission de balises | 
 La balise de début peut être absente si le premier contenu est un
 élément.La balise de fermeture peut être absente si le premier
 objet suivant l'élément `<head>` n'est pas un caractère
 blanc ou un commentaire.
  |
| Parents autorisés | 
 Cet élément doit être le premier enfant de l'élément
 `<html>`.
  |
| Rôles ARIA autorisés | Aucun. |
| Interface DOM | `HTMLHeadElement` (en-US) |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-head-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les éléments qui peuvent être utilisés à l'intérieur de l'élément `<head>` :
    + `<title>`
    + `<base>`
    + `<link>`
    + `<style>`
    + `<meta>`
    + `<script>`
    + `<noscript>`
    + `<template>`