Please note, this is a STATIC archive of website www.w3schools.com from 05 May 2020, cach3.com does not collect or store any user information, there is no "phishing" involved.
THE WORLD'S LARGEST WEB DEVELOPER SITE

HTML <map> Tag


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>
Try it Yourself »

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


Attributes

Attribute Value Description
name mapname Required. Specifies the name of an image-map

Global Attributes

The <map> tag also supports the Global Attributes in HTML.


Event Attributes

The <map> 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;
}