HTML <area> coordsAttribute
HTML <area> TagExamples
An image map with clickable areas:
<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>
Try it Yourself »
Browser Support
All major browsers support the coords attribute.
Definition and Usage
The coords attribute specifies the x and y coordinates of an area.
The coords attribute, together with theshapeattribute, is used to specify the size, shape, and position of an area.
Tip:The coordinates of the top-left corner of an image are "0,0".
Differences between HTML 4.01 and HTML5
NONE.
Syntax
<area coords="value">
Attribute Values
| Value | Description |
|---|---|
| x1,y1,x2,y2 | If the shape attribute is set to "rect", this value specifies the coordinates of the top-left and bottom-right corners of the rectangle. |
| x,y,radius | If the shape attribute is set to "circ", this value specifies the coordinates of the circle's center and the radius. |
| x1,y1,x2,y2,..,xn,yn | If the shape attribute is set to "poly", this value specifies the coordinates of each vertex of the polygon. If the first and last coordinates are not the same, the browser must add the last pair of coordinates to close the polygon. |
Other Extensions