How to add HTML <area> coords Attribute
Use the coords attribute to specify the coordinates of each area in the image map.
Definition and Usage
The coords attribute specifies the coordinates of an area in an image map.
The coords attribute is used together with the shape attribute to specify the size, shape, and placement of an area.
Tip: The coordinates of the top-left corner of an area are 0,0.
Browser Support
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<h1>The area coords attribute</h1>
<p>Click on the sun or on one of the planets to watch it closer:</p>
<img src="https://horje.com/avatar.png" width="145" height="126" alt="Planets" usemap="#planetmap">
<map id="planetmap" name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="https://horje.com">
<area shape="circle" coords="90,58,3" alt="Mercury" href="https://horje.com/avatar.png">
<area shape="circle" coords="124,58,8" alt="Venus" href="https://horje.com">
</map>
</body>
</html>
Output should be:
Type: | Html |
Category: | Web Tutorial |
Sub Category: | HTML Tag |
Uploaded by: | Admin |