<map>

The HTML <map> element is used with <area> elements to define an image map (a clickable link area).

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Attributes

This element includes the global attributes.

name

The name attribute gives the map a name so that it can be referenced. The attribute must be present and must have a non-empty value with no space characters. The value of the name attribute must not be a compatibility-caseless match for the value of the name attribute of another <map> element in the same document. If the id attribute is also specified, both attributes must have the same value.

Examples

<map name="primary">
  <area shape="circle" coords="75,75,75" href="left.html">
  <area shape="circle" coords="275,75,75" href="right.html">
</map>
<img usemap="#primary" src="https://placehold.it/350x150" alt="350 x 150 pic">

Result

Expected live example output

The live example above should appear similar to the following images (when using your keyboard tab key):

For the left.html link:

For the right.html link

Specifications

Browser compatibility

See also

• <a>
• <area>