使用html area标签在图片上设置链接

一张图片的静态页！如果你不会切图做静态页，那么就用一张效果图来实现吧！

原理：在图片上设置链接的area标签，产生图片的局部点击事件效果~

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />相当于效果图

<map name="planetmap" id="planetmap">效果图中需要被点击的区域集合

<area shape="circle" coords="180,139,14" href ="1.html" alt="点我，第一步" />可点击区域定义

<area shape="circle" coords="129,161,10" href ="2.html" alt="点我，第二步" />可点击区域定义

<area shape="rect" coords="0,0,110,260" href ="3.html" alt="点我，最后一步" />可点击区域定义

</map>

参数说明：

shape：可点击区域形状

1）rect：矩形。

2）circle：圆形。

coords：可点击区域坐标

1）当shape是矩形时，此值是4个坐标值，前两个为坐上坐标（x，y），后两个为右下坐标

2）当shape是圆形时，此值是3个坐标值，前两个为圆形的坐标，最后一个为半径。

usemap：使用哪个map的区域点击事件

这里介绍的是html4中area标签属性，可能html5中有区别

参考：http://www.w3school.com.cn/tags/tag_area.asp