Exemple
Une image-carte, avec des zones cliquables:
<img src="planets.gif"
width="145" height="126"
alt="Planets"
usemap="#planetmap">
<map
name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
Essayez - le vous - même » Définition et utilisation
La <area> balise définit une zone à l' intérieur d' une carte-image (une image-carte est une image avec des zones cliquables).
La <area> élément est toujours imbriqué dans une <map> tag.
Remarque: Le usemap attribut dans le <img> tag est associé à la <map> attribut name de l' élément, et crée une relation entre l'image et la carte.
support du navigateur
| Élément | |||||
|---|---|---|---|---|---|
| <area> | Oui | Oui | Oui | Oui | Oui |
Différences entre HTML 4.01 et HTML5
HTML5 a quelques nouveaux attributs, et certains HTML 4.01 attributs ne sont plus pris en charge.
Différences entre HTML et XHTML
Dans HTML le <area> balise n'a pas de balise de fin.
En XHTML la <area> balise doit être correctement fermé.
Les attributs
= Nouveau en HTML5.
| Attribut | Valeur | La description |
|---|---|---|
| alt | text | Indique un texte alternatif pour la région. Requis si l' href attribut est présent |
| coords | coordinates | Indique les coordonnées de la zone |
| download | filename | Indique que la cible sera téléchargé lorsqu'un utilisateur clique sur le lien hypertexte |
| href | URL | Indique la cible de lien hypertexte pour la zone |
| hreflang | language_code | Indique la langue de l'URL cible |
| media | media query | Indique quels médias / périphérique l'URL cible est optimisé pour |
| nohref | value | Non pris en charge en HTML5. Indique qu'une zone a aucun lien associé |
| rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag | Indique la relation entre le document courant et l'URL cible |
| shape |
default rect circle poly | Indique la forme de la zone |
| target | _blank _parent _self _top framename | Indique où ouvrir l'URL cible |
| type | media_type | Indique le type de support de l'URL cible |
Attributs globaux
La <area> tag soutient également le attributs globaux en HTML .
Attributs de l'événement
La <area> tag soutient également l' événement Attributs en HTML .
Pages associées
Référence HTML DOM: Zone Object
Paramètres par défaut de CSS
La plupart des navigateurs afficheront la <area> élément avec les valeurs par défaut suivantes:
area {
display:
none;
}