Posted on: September 10, 2010 at 12:00 AM
HTML5 map tag, Example of <map> tag in html5
In this section we will discuss the use of <map> tag and about its implementation in the html document. The <map> tag is used for defining an image map. Image map is the image divided in to clickable areas or we can say mouse sensitive areas. It means when we click on those areas in the image map it sends to another page or resource. It works just like a hyperlink works in the text. The <map> tag is used in conjuction with <img> tag. The <area> tag is used only within the <map> tag, the regions within image map is mouse sensitive.
Declaration Syntax:
The syntax for the <map> tag is as follows.
| <map name="value">Areas Definition </map> |
Attribute of <map> tag.
In the <map> tag there are only one specific attribute given below. some times programmer use "id" attribute, Have same meaning.
name="value" The value of the attribute is the name assingned to the map.
Example_map_tag.html.
| <!DOCTYPE html > <html> <head> <title> Example of map Tag </title> </head> <body> <img src="comp.gif" width="350" height="299" usemap="#computermap" /> <map name="computermap"> <area coords="16, 78, 123, 242" href="cpu.gif" shape="rect" alt="cpu"/> <area coords="138, 90, 303, 239" href="monitor.gif" shape="rect" alt="monitor"/> <area coords="70, 244, 324, 290" href="keyboard.gif" shape="rect" alt="keyboard"/ > </map> </body> </html> |
Output: For getting output, please click the image and then any part of the image.
Difference between HTML5 and HTML4
There is no difference from html4.
If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.
Ask your questions, our development team will try to give answers to your questions.
