HTML coords attribute
coords means coordinates in the 2-D plane. These coordinates are used to draw the shape on an image.
<img src="files/three images.jpg" usemap="#shapes" alt="three shapes of triangle, square, circle">
<area alt="triangle" title="triangle" href="files/triangle.html" shape="poly" coords="13,122,50,61,86,123" />
coords attribute values
The value of coords attribute is the integers separated by a comma.
Coordinates of a circle are given below.
<area alt="circle" title="circle" href="files/circ.html" shape="circle" coords="196,89,33" />
There are three integers (coordinates) in the coords attribute.
The first integer is the distance of circle from the left edge of the image.
The second integer is the distance of circle from the top edge of the image.
The third integer is the radius of the circle.
Coordinates of a rectangle are given below.
<area alt="rectangle" title="rectangle" href="blue" shape="circle" coords="196,89,33" />
There are four coordinates of the rectangle.
The four integers represent the distance from the left edge of the image to the left side of rectangle, from the top edge of the image to the top side of rectangle, from the left edge of the image to the right side of rectangle, from the top edge of the image to the bottom side of the rectangle.
For a polygon, coordinates are given below. The following coordinates represent a square.
<area href="files/square.html" coords="94,122,93,58,158,58,157,122" title="square" shape="poly">
A polygon always has even no. of integers. The above example has three pairs of integers.
One pair (one integer is the distance of point from the left side and the other integer is the distance from the top side) represents two coordinates.
Same is the case with second and third pairs. These coordinates should be present in the order.
By default the coords attribute does not have any value and the shape is the whole image.
<area alt="default" title="default" href="files/three images.jpg" shape="default" coords="0" />
area tag supports the coords attribute.