使用usemap属性;
点
击图片的不同位置,链接到不同的页面
usemap="#自定义的map"
自定义的map:需要name和id属性,
map中可以自定义多个area
area的属性:
shape:定义热点区的形状 rect circle poly
coords:坐标
rect形状:坐标是4个值,左上角的x,y,右下角的x,y值
circle形状:坐标是3个值,圆心坐标,半径
poly形状:坐标就是每个顶点的值,注意顺序
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片的热点区域</title>
</head>
<body>
<img src="img/ad-03.jpg" usemap="#map"/>
<map name="map" id="map">
<area shape="rect" coords="0,0,141,76" href="login.html" />
<area shape="circle" coords="60,135,57" href="register.html" />
<area shape="poly" coords="230,102,306,174,230,170" href="a-mao.html" />
</map>
</body>
</html>
自已写跳传页面的内容