Attribut shape de HTML <area>

Définition et utilisation

shape détermine la forme de la zone.

shape L'attribut Attribut coords Utilisés ensemble pour définir la taille, la forme et la position de la zone.

Exemple

Utilisez l'attribut shape pour spécifier la forme de chaque zone dans la carte d'image :

<map name="planetmap">
<area shape="rect" coords="0,0,114,576" href="sun.html" alt="Soleil">
<area shape="circle" coords="190,230,5" href="mercur.html" alt="Mercure">
<area shape="circle" coords="228,230,5" href="venus.html" alt="Vénus">
</map>

Essayez-le vous-même

Syntaxe

<area shape="default|rect|circle|poly">

Valeur de l'attribut

Valeur Description
default Définir l'ensemble de la zone.
rect Définir une zone rectangulaire.
circle Définir une zone circulaire.
poly Définir une zone polygonale.

Explication détaillée :

shape L'attribut est utilisé pour définir la forme de la zone sensible au curseur dans la carte d'image:

  • Cercle (circ ou circle)
  • Polygone (poly ou polygon)
  • Rectangle (rect ou rectangle)

shape La valeur de l'attribut affecte l'interprétation du navigateur par rapport à l'attribut coords. Si l'utilisation shape Si la propriété n'est pas spécifiée, le navigateur suppose que la valeur utilisée est "default". Selon la norme, "default" signifie que la zone couvre l'image entière. Dans la pratique, les navigateurs utilisent par défaut une zone rectangulaire et s'attendent à trouver 4 valeurs coords. Si la forme n'est pas spécifiée et que les 4 coordonnées ne sont pas incluses dans l'étiquette, le navigateur ignore la zone entière.

reconnaissable shape Les navigateurs qui peuvent fournir une zone incluant toutes les zones chaudes, pour les cas où un clic est effectué au-delà de la portée définie par d'autres zones chaudes. Comme les zones dans la balise <map> sont utilisées dans un ordre "premier arrivé, premier servi", toutes les zones par défaut doivent être placées à la fin. Sinon, la zone par défaut couvrira toutes les autres zones qui apparaissent dans d'autres images de carte.

Les navigateurs n'ont pas de exigences strictes concernant la mise en œuvre des noms de formes. Par exemple, pour le rectangle, Netscape 4 ne reconnaît pas "rectangle", mais il reconnaît "rect". Pour cette raison, nous recommandons d'utiliser des noms abrégés.

Compatibilité des navigateurs

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support