HTML5图像映射

为图片建立超链接(img元素)

由于img元素是行内级元素,所以可以使用a元素为图片定义超链接。当用户单机图片是就会跳转到链接所指向的文档。

    
         
    
创建图像映射

可以为某个部位创建一个称为“热点”的区域,每个热点就是一个映射,当用户单击不同热点时就可以跳转到不同的网页。
使用area元素定义图像中的热点区域,然后使用map元素将热点区域与img元素关联起来。


    usemap对应name
    
    
    

解析:

  1. shape 定义热点的形状
    shape="circle" 多边形
    shape="rect" 矩形
    shape="poly" 多边形

  2. coords 定义区域点的坐标
    1) rect 矩形, 规定有四个值,前两个表示左上角的坐标,后两个值表示右下角的坐标值
    2) circle 圆形,规定有三个值,前两个数表示圆心坐标,最后一个值表示圆的半径长度
    3) poly 多边形(任意图形),规定的值即为图形的每一个转折点的坐标值

图像映射分为在服务器上分析和在客户端浏览器中分析两种。前者称为客户端图像映射,后者称为服务端图像映射。

你可能感兴趣的:(HTML5图像映射)