玩转前端！图片热点区域如何使用？

最近学习了图片热区，相信大家对热区的定位还存在疑惑，下面我将简单介绍一下它的使用

1. 首先贴出它的代码

//热区
<img src="unite.jpg" usemap="#mymap">
  <map name="mymap" id="mymap">
    <area shape="circle" coords="75,75,75" alt="圆形热区" href="">
    <area shape="rect" coords="10,160,150,280" alt="" href="矩形热区">
    <area shape="poly" coords="25,20,112,20,112,50,25,50" alt="多边形热区" href="">
  </map>

2. 可以通过shape=" "属性对热区形状进行设定
3. coords=" "给出其坐标位置
   顶点的坐标顺序为顺时针选取
X，Y坐标原点为图片左上角
坐标长度单位为px，坐标点具体看图片大小

（圆形：圆心坐标位置，以及半径）需三个值
eg：coords=“75,75,75”

（矩形：对角坐标）需四个值
eg：coords=“10,160,150,280”

（多边形：所有顶点的坐标）需2n个值
eg：正方形 coords=“25,20,112,20,112,50,25,50”