<img>下图片映射
<map>与<area>
<img src="cat.jpg" alt="圣诞猫" usemap="#catmap"> ?<map name="catmap"> ?????<area shape="" coords="" href="" target="_blank" > ?????<area shape="" coords="" href="" target="_blank" > ?</map>
<area>中坐标从左上角(0,0)点起，向右x轴，向下y轴，（中心点获取可用qq的截图功能，从左上角开始截图，长宽即为中心点坐标）
shape属性：“circle”、“rect”、“poly”，
<area shape="circle" coords="中心点，圆的半径（204，511，50）" href="" >
<area shape="rect" coords="矩形左上角点的坐标，右下角点的坐标（287,486,359,545）" href="" >
<area shape="poly" coords="分别列出多边形每个顶点的坐标" href="" >
<!DOCTYPE html><html><head> ???<meta charset="utf-8" /> ???<title>图片映射</title></head><body> ?<img src="cat.jpg" alt="圣诞猫" usemap="#catmap"> ??<map name="catmap"> ?????<area shape="circle" coords="204,511,40"
href="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1541497764763&di=f515456a13384605e140751e455323d9&imgtype=0&src=http%3A%2F%2Fpic21.photophoto.cn%2F20111125%2F0017030594470929_b.jpg"
target="_blank" > ?????<area shape="rect" coords="287,486,359,545"
href="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1541497911660&di=59b640621e3342303cfbbef44685075a&imgtype=jpg&src=http%3A%2F%2Fimg4.imgtn.bdimg.com%2Fit%2Fu%3D3414111129%2C2073799617%26fm%3D214%26gp%3D0.jpg"
target="_blank" > ?</map> </body></html>
HTML图片映射
原文地址：https://www.cnblogs.com/Amy-world/p/9915521.html