ainiu 发表于 2018-9-24 15:55:27

什么是HTML图像映射?HTML图像映射介绍

HTML图像映射,指的是利用<map>和<area>标签配合,在图像上面定义一些可链接区域。

范例代码如下(从w3cshool直接拷贝得来):

<img src="/planets.jpg" border="0"usemap="#planetmap" alt="Planets" />
<map name="planetmap"id="planetmap">
    <area shape="circle" coords="180,139,14"href ="venus.html" alt="Venus" />
<area shape="circle"coords="129,161,10" href ="mercur.html" alt="Mercury" />
    <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun"/>
</map>

如例所示:img通过使用usemap属性,指定name为"planetmap"的map。
<area>来定义区域的形状(shape)、位置(coords)、链接地址(href)。

要重点说明的是区域位置的定义,coords,有四个“坐标”值。爱牛北京网络营销公司
1.区域左边缘 距离 图像左边缘的距离
2.区域上边缘 距离 图像上边缘的距离
3.区域右边缘 距离 图像左边缘的距离
4.区域下边缘 距离 图像上边缘的距离

这四个值,如果不是经常用,很容易就忘了具体是啥子意思了。

但是,HTML图像映射的缺点是,表现力不够丰富,大多数浏览器不能定义出<area>的样式,所以是个隐讳的图像地图。

如果想做更具表现力的图像地图,就要用到CSS来做图像映射。

页: [1]
查看完整版本: 什么是HTML图像映射?HTML图像映射介绍