图片的映射--map标签

自从上一下公司离职后，就没有继续更新博客了，最近在做前端的相关兼职。
今天客户要求使用一张大图，然后在其中应用多个超链接，对于之前没用过map标签的我是懵逼的。
但通过学习，发现map挺方便的，于是继续更新博客记录我的新手前端生涯。
话不多说，直接上代码：

<img src='img/as.png'  class="img-responsive" usemap="#planetmap2"/>
<map name="planetmap2" id="planetmap2">
	 <area shape="circle" coords="45,47,40" href="#" alt="..." />
	 <area shape="circle" coords="45,133,40" href="#" alt="..." />
	 
	 <area shape="circle" coords="130,47,40" href="#" alt="..." />
	 <area shape="circle" coords="130,133,40" href="#" alt="..." />
	 
	 <area shape="circle" coords="220,47,40" href="#" alt="..." />
	 <area shape="circle" coords="220,133,40" href="#" alt="..." />
	 
	 <area shape="circle" coords="300,47,40" href="#" alt="..." />
	 <area shape="circle" coords="300,133,40" href="#" alt="..." />
</map>

效果：

点击不同的位置，链接到不同的地方。
对于img要使用 usemap="#planetmap2"和map标签连在一起，其中coords是定位，x（水平距离），y（垂直距离），z（半径）。