HTML 图片热点区域＜area＞

一、说明

对于图片标签<img>, 可以定义其热点区域，简而言之就是鼠标指向图片的具体位置为热点区域，可以定义为圆形、矩形、多边形。

 二、标签使用

<map name="map">
  <area shape="rect" coords="75,75,99,99" nohref="nohref">
  <area shape="circ" coords="50,50,25" nohref="nohref">
  <area shape="polygon" coords="50,50,25,25,26,26" nohref="nohref">
</map>

<map> ： 包含热点区域

属性	描述
name	与<img> 标签的 usemap=‘#map’ 相互关联映射

<area>： 热点区域定位

shape属性 决定热点区域的形状，分别有

• rect：    矩形
• circle： 圆形
• poly： 多边形

coords属性 各个点的坐标值，与shape相关联

shape	coords的value值	描述
rect	x1,y1,x2,y2	该值规定矩形左上角和右下角的坐标。
circle	x,y,radius	该值规定圆心的坐标和半径。
poly	x1,y1,x2,y2,..,xn,yn	该值规定多边形各边的坐标。如果第一个坐标和最后一个坐标不一致，那么为了关闭多边形，浏览器必须添加最后一对坐标。