HTML | <map> Tag

The <map> tag is to define the map-image on the user interface which is clickable. The <map> required the <img> tag that helps the relation between the image and map. The <map> element contains a number of <area> elements that define the clickable areas in the image map.

Syntax: 

 <map name=""> </map>

Example:  

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML | <map> Tag
    </title>
</head>
 
<body>
    <center>
         
 
<p>Click on Images where the cursor
          clickable.(Top-left corner)</p>
 
 
 
        <img src=
"https://media.w3wiki.net/wp-content/uploads/20190808143838/logsm.png"
             alt="Beginner_logo"
             usemap="#gfg">
 
        <map name="gfg">
            <area shape="rect"
                  coords="0, 0, 50, 50"
                  alt="gfg"
                  href=
"https://media.w3wiki.net/wp-content/uploads/20190821123122/gfgsm.png">
        </map>
    </center>
</body>
 
</html>


Output:

 Before: 

After:  

Supported Browsers: The browsers supported by HTML <map> Tag are listed below:  

  • Google Chrome 1
  • Edge 12
  • Internet Explorer
  • Firefox 1
  • Safari 1
  • Opera

 


Contact Us