html-basics/ImageMap1.html at master · steffytw/html-basics · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>

<head>
	<title>Mapping an Image </title>
</head>

<body>
<h1>Mapping an Image</h1>
<p>Click on the different continents of the map to know about them.</p>

<img src="https://cdn.pixabay.com/photo/2013/07/12/16/57/world-map-151576_960_720.png" width="960" height="492"
								alt="World Map" usemap="#worldmap">

<map name="worldmap">
<area shape="rect" coords="184, 36, 272, 158" alt="north america"
				href="https://en.wikipedia.org/wiki/North_America">

<area shape="rect" coords="282, 215, 354, 367" alt="south america"
				href="https://en.wikipedia.org/wiki/South_America">

<area shape="rect" coords="506, 151, 570, 333" alt="africa"
				href="https://en.wikipedia.org/wiki/Africa">

<area shape="rect" coords="618, 42, 791, 162" alt="asia"
				href="https://en.wikipedia.org/wiki/Asia">

<area shape="rect" coords="509, 44, 593, 110" alt="europe"
			href="https://en.wikipedia.org/wiki/Europe">

<area shape="rect" coords="786, 288, 862, 341" alt="australia"
			href="https://en.wikipedia.org/wiki/Australia_(continent)">

<area shape="rect" coords="249, 463, 760, 488" alt="antartica"
			href="https://en.wikipedia.org/wiki/Antarctica">
</map>

</body>
</html>