登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

istyles

貌似非要取个名字,就叫istyles吧。

 
 
 

日志

 
 

HTML <map> 标签  

2011-02-25 10:29:53|  分类: 工作笔记 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

<img src="http://istyles.blog.163.com/blog/images/test-2.jpg" usemap="#testMap" alt="test" />
<map id="testMap" name="testMap">
    <area shape="rect" coords="230,110,320,200" href="http://www.baidu.com/" target="_blank" title="baidu" />
    <area shape="circle" coords="134,158,50" href="http://www.google.com/" target="_blank" title="google" />
</map>

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

HTML map 标签 - Cat - istyles
 

<area> 标签的 coords 属性定义了客户端图像映射热区中对鼠标响应区域的坐标。坐标的数字及其含义取决于 shape 属性中决定的区域形状。

下面列出了每种形状的适当值:

圆形:shape="circle",coords="x,y,z"
例如:shape="circle" 热区为圆形,coords="134,158,50" 
           三个参数分别为:圆心X坐标,圆心Y坐标,半径。


矩形:shape="rectangle",coords="x1,y1,x2,y2"
例如:shape="rect" 热区为矩形,coords="230,110,320,200"
          
四个参数分别为:左上角X坐标、左上角Y坐标,右上角X坐标、右上角Y坐标
第一个坐标是矩形的一个角的顶点坐标,另一对坐标是对角的顶点坐标,"0,0" 是图像左上角的坐标。请注意,定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。

多边形:shape="polygon",coords="x1,y1,x2,y2,x3,y3,..."
每一对 "x,y" 坐标都定义了多边形的一个顶点("0,0" 是图像左上角的坐标)。定义三角形至少需要三组坐标;高纬多边形则需要更多数量的顶点。
多边形会自动封闭,因此在列表的结尾不需要重复第一个坐标来闭合整个区域。

要注意的是:<img>标签中的 usemap 属性可引用 <map> 中的 id 或 name 属性(这取决于浏览器),所以我们最好同时向 <map> 添加 id 和 name 属性。
  评论这张
 
阅读(653)| 评论(0)

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018