网页文档中少不了图片展示,HTML中关于图像的标签有<img><map>和<area>。
<!DOCType html>
<html>
<head>
<meta charset="utf-8">
<title>图像标签</title>
</head>
<body>
<!--无交互的图像显示-->
<img src="pictures/cat.jpeg" alt="cat.jpeg" width="200" height="150"><br>
<!--图像链接-->
<a href="http://www.baidu.com"><img src="pictures/baidu.jpeg"></a><br>
<!--图像热区映射-->
<img src="pictures/map.jpeg" width="640" height="621" alt="map" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,250,250" href="test1.html" alt="girl">
<area shape="rect" coords="500,0,125,125" href="test2.html" alt="dragonCat">
</map>
</body>
</html>>
<!DOCType html>
<html>
<head>
<title>test1页面</title>
</head>
<body>
<img src="pictures/girl.jpeg">
</body>
</html>>
<!DOCType html>
<html>
<head>
<title>test2页面</title>
</head>
<body>
<img src="pictures/dragonCat.jpeg">
</body>
</html>>
点击百度图标
点击地图图像热区1
点击地图图像热区2