Example
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>
Definition and Usage
The <map> tag is used to define a client-side image-map. An image-map is an image with clickable areas.
The required name attribute of the <map> element is associated with the <img>’s usemap attribute and creates a relationship between the image and the map.
The <map> element contains a number of <area> elements, that defines the clickable areas in the image map.
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <map> | Yes | Yes | Yes | Yes | Yes |
Differences Between HTML 4.01 and HTML5
Note: In HTML5, if the id attribute of the <map> tag is also specified, it must have the same value as the name attribute.
Differences Between HTML and XHTML
In XHTML, the name attribute is deprecated, and will be removed. Use the global id attribute instead.
| Attribute | Value | Description |
|---|---|---|
| name | mapname | Required. Specifies the name of an image-map |
Global Attributes
The <main> tag also supports the Global Attributes in HTML.
Event Attributes
The <main> tag also supports the Event Attributes in HTML.
Related Pages
HTML DOM reference: Map Object
Default CSS Settings
Most browsers will display the <map> element with the following default values:
map {
display: inline;
}
HTML <map> name Attribute
Example
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>
Definition and Usage
The required name attribute specifies the name of an image-map.
The name attribute is associated with the <img>’s usemap attribute and creates a relationship between the image and the map.
Browser Support
| Attribute | |||||
|---|---|---|---|---|---|
| name | Yes | Yes | Yes | Yes | Yes |
Differences Between HTML 4.01 and HTML5
NONE.
Syntax
<map name=”mapname“>
Attribute Values
| Value | Description |
|---|---|
| mapname | The name of the image-map |
