星空网 > 软件开发 > 网页设计

深入理解HTML图像

目录

[1]<img> [2]<map> [3]<area> [4]注意事项

<img> -> image 图像

    【必须属性】

        【1】src:地址

        【2】alt:图像替代文本,供探索引擎抓取使用

    【可选属性】

        【1】height:图像高度

        【2】width:图像宽度

        【3】ismap:为图像定义为服务器端图像映射

        【4】longdesc:与alt属性类似,提供多于1024字符的长文本描述

        【5】usemap:为图像定义客户端图像映射 usemap = "#<map>元素的name或id属性"

<img src='/images/loading.gif' data-original="test.jpg"  width="100" height="100">

深入理解HTML图像

 

<map>映射地图

        [注意]<img>中的usemap属性可引用<map>中的id或name属性(取决于浏览器),所以应同时向<map>添加id和name属性。

 

<area>图像热区

  <area>总是嵌套在<map>标签中

    【必须属性】

        【1】alt:替代文本

    【可选属性】

        【1】coords:定义可点击区域的坐标

        【2】href:定义此区域的目标URL

        【3】nohref:排除某个区域

        【4】shape:定义区域的形状

            【a】圆形(circ/circle)    

            【b】多边形(poly/polygon)

            【c】矩形(rect/rectangle)

            【d】全部区域default(默认)

            [注意]<area>标签采用"先来先得"的顺序,如果区域有重叠,以先出现的<area>为准

<img src='/images/loading.gif' data-original="jihe.jpg"  width="600" height="220" usemap="#Map"><map name="Map"> <area shape="rect" coords="35,38,150,158" href="line4.html" > <area shape="poly" coords="175,109,193,44,268,41,296,109,233,151" href="line6.html" > <area shape="poly" coords="315,81,330,58,356,40,387,37,411,52,430,79,433,108,418,132,389,153,357,154,333,137,315,108" href="line12.html" > <area shape="circle" coords="512,95,60" href="line0.html" ></map>

深入理解HTML图像

深入理解HTML图像

 




原标题:深入理解HTML图像

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流