How can HTML be used to create image maps with specific shapes for links?

To create image maps with specific shapes for links in HTML, you can use the <map> and <area> tags along with the <img> tag. The <map> tag defines an image map and the <area> tag defines the clickable areas within the image. You can specify the shape of the clickable area (rectangular, circular, or polygonal) and provide coordinates for each shape to define the clickable region for the link. ```html <!DOCTYPE html> <html> <head> <title>Image Map Example</title> </head> <body> <img src="example.jpg" usemap="#map1" alt="Example Image" width="500" height="500"> <map name="map1"> <area shape="rect" coords="0,0,250,250" href="page1.html" alt="Link 1"> <area shape="circle" coords="300,300,50" href="page2.html" alt="Link 2"> <area shape="poly" coords="400,100,450,150,400,200,350,150" href="page3.html" alt="Link 3"> </map> </body> </html> ```

Keywords

HTML image maps specific shapes links PHP

Related Questions