HTML <img> usemapAttribute
Example
An image map with clickable areas:
<img src="planets.gif.html"
width="145" height="126"
alt="Planets"
usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm.html" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm.html" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm.html" alt="Venus">
</map>
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm.html" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm.html" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm.html" alt="Venus">
</map>
Try it Yourself »
Browser Support
![]()
![]()
![]()
![]()
![]()
All major browsers support the usemap attribute.
Definition and Usage
The usemap attribute defines the image as a client-side image map (an image map refers to an image with clickable areas).
The usemap attribute is associated with the<map>element's name or id attribute to establish the relationship between <img> and <map>.
Note:The usemap attribute is only allowed when the <img> element is not a descendant of an <a> or <button> element.
Differences between HTML 4.01 and HTML5
None.
Syntax
<img usemap="#mapname">
Attribute Values
| Value | Description |
|---|---|
| #mapname | A hash character ("#") plus the name or id of the <map> element to be used. |
HTML <img> Tag Other Extensions