W3docs

Attribut coords HTML

The HTML coords attribute specifies the coordinates of an area in the image-map. Read about this property and see an example of its usage on the <area> element.

L'attribut HTML coords spécifie les coordonnées d'une zone dans la carte d'image. Pour spécifier la forme, la taille et l'emplacement d'une zone, il est utilisé avec l'attribut shape.

Vous pouvez utiliser cet attribut sur l'élément <area>.

Le coin supérieur gauche d'une zone a les coordonnées 0,0.

L'attribut coords peut prendre les valeurs suivantes :

  • x1, y1, x2, y2. Il spécifie les coordonnées des coins supérieur gauche (x1, y1) et inférieur droit (x2, y2) d'un rectangle.
  • x, y, radius. Il spécifie les coordonnées du centre (x, y) et le rayon (radius) d'un cercle.
  • x1, y1, x2, y2, .., xn, yn. Il spécifie les coordonnées d'un polygone.

Syntaxe

Syntaxe de l'attribut HTML coords

<area coords="value">

Exemple de l'attribut HTML coords :

Exemple de l'attribut HTML <span class="attribute">"coords"</span>

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>Click on the logo or on one of the logo item to watch it closer:</p>
    <img src="/uploads/media/news_gallery/0001/01/thumb_316_news_gallery_list.jpeg"  width="250" height="150" alt="block" usemap="#blockmap" />
    <map name="blockmap">
      <area shape="circle" coords="50,32,25" alt="html" href="/uploads/media/book_gallery/0001/01/d450f0358f947dffb3af91195c3002600d74101b.png" />
      <area shape="circle" coords="218,115,25" alt="css" href="/uploads/media/book_gallery/0001/01/25521e981b34da57c8f51baddc5b76351b855818.png" />
      <area shape="circle" coords="195,32,28" alt="php" href="/uploads/media/book_gallery/0001/01/4bbee6698c4884f25c46010d61b658dd62d2c04f.png" />
      <area class="homepage" shape="rect" coords="90,90,35,55" alt="php" href="https://www.w3docs.com/" />
    </map>
  </body>
</html>

Pratique

Pratique

Quelle est la fonction de l'attribut 'coords' en HTML et comment est-il utilisé ?