<map>
Baseline Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
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
<map name="infographic"> <area shape="poly" coords="130,147,200,107,254,219,130,228" href="https://developer.mozilla.org/docs/Web/HTML" alt="HTML" /> <area shape="poly" coords="130,147,130,228,6,219,59,107" href="https://developer.mozilla.org/docs/Web/CSS" alt="CSS" /> <area shape="poly" coords="130,147,200,107,130,4,59,107" href="https://developer.mozilla.org/docs/Web/JavaScript" alt="JavaScript" /> </map> <img usemap="#infographic" src="/shared-assets/images/examples/mdn-info2.png" alt="MDN infographic" /> img { display: block; margin: 0 auto; width: 260px; height: 232px; } 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 universelidest utilisé,namedevra avoir la même valeur que celui-ci.
Exemples
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 : 
Pour le lien right.html : 
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 |
Spécifications
| Specification |
|---|
| HTML # the-map-element |