Loading...
HTML <map> Tag

HTML <map> Tag

In this tutorial, we will learn about map tag in HTML with the help of examples.


<map> Tag

Map tag <map> is used to define an image map.An image map is an image with clickable areas.

Note : To create the relationship between the <img> tag and the <map> tag by using the name of the name attribute(in <map> tag) as the usemap attribute(in <img> tag). The tag contains a number of <area> tag, that defines the clickable areas in the image map.

Syntax

<map>........</map>

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Map Tag</title>
  </head>
  <body>
    <img src = "boat.png" width = "500" height = "500" alt = "Image not found" usemap = "#tutorial">
    <map name = "tutorial">
      <area shape = "poly" coords = "70,0,112,28,99,70,50,70,39,25" href = "www.algbly.com" target = "_blank" />
      <area shape = "rect" coords = "500,580,125,120" href = "www.algbly.com" target = "_blank" />
    </map>
  </body>
</html>

Output

Image not found

Specific Attribute

Attribute Value Description
name unique_name Defines a unique name for the <map> tag

Global Attribute

Map Tag support all the global attributes of HTML.


Event Attribute

Map Tag support all the event attributes of HTML.


Next Tutorial

We hope that this tutorial helped you develop better understanding of the concept of <map> tag in HTML.

Keep Learning : )

In the next tutorial, you'll learn about HTML <mark> Tag.

- Related Topics