HTML 标签的 shape 属性:图片选区获得焦点
来源:互联网 发布:软件开发界面设计工具 编辑:程序博客网 时间:2024/06/07 02:08
http://www.w3school.com.cn/tags/att_area_shape.asp
--效果图
http://www.ef.com.cn/englishfirst/courses/adults/smart/our-method.aspx
定义和用法
shape 属性与 coords 属性配合,可以规定区域的尺寸、形状和位置。
详细解释:
shape 属性用于定义图像映射中对鼠标敏感的区域的形状:
- 圆形(circ 或 circle)
- 多边形(poly 或 polygon)
- 矩形(rect 或 rectangle)
shape 属性的值会影响浏览器对 coords 属性的解释。如果未使用 shape 属性,那么会假设使用值 default。依照标准,default 意味着该区域覆盖整个图像。在实际中,浏览器默认使用矩形区域,并期望能找到 4 个 coords 值。如果没有指定形状,而且在标签中也没有包括 4 个坐标,那么浏览器会忽略整个区域。
实际上,Netscape 是唯一可以识别 shape 属性的 default 值的浏览器,它可以提供一个包括全部热点的区域,以用于在超过其他热点定义的范围之外单击的情况。由于区域在 <map> 标签中是采用“先来先得”的顺序,所有必须将默认区域放置在后面。否则,默认区域会覆盖其他的图像映射中出现的所有区域。
浏览器在形状名称的实现方面没有严格要求。例如,对于矩形,Netscape 4 不能识别 "rectangle",却能识别 "rect"。出于这个原因,我们建议使用缩写的名称。
实例
<img src ="planets.gif" alt="Planets" usemap ="#planetmap" /><map name="planetmap"> <areashape="rect"
coords="0,0,110,260" href="sun.htm" alt="Sun" /> <areashape="circle"
coords="129,161,10" href="mercur.htm" alt="Mercury" /> <areashape="circle"
coords="180,139,14" href="venus.htm" alt="Venus" /></map>
TIY
浏览器支持
所有浏览器都支持 shape 属性。
语法
<a shape="value">
属性值
- HTML 标签的 shape 属性:图片选区获得焦点
- [HTML]HTML<area> 标签的shape与coords 属性W3CSHOOL
- input标签的获得焦点和失去焦点的样式
- html获得当前焦点所在的控件
- 获得焦点时的边框属性outline
- 使用HTML标签的属性对图片进行旋转效果
- js获得当前系统时间(html标签自定义属性)
- html select标签的属性
- HTML 标签的 coords 属性
- HTML 标签的 target 属性
- HTML 标签的 target 属性
- HTML 标签的 valign 属性
- HTML标签的type属性
- HTML 标签的 rules 属性
- HTML的元素、标签、属性
- html select标签的属性
- html中怎么自动获得搜索文本框的光标焦点
- 设置控件获得焦点顺序的属性tabindex
- Android应用程序剖析
- 并查集的使用 POJ 1182
- c++中main函数参数的意义
- 奇妙装置各种Windows操作体系
- ClassNotFoundException:org.hibernate.hql.ast.HqlToken-weblogic使用hibernate hql问题解决
- HTML 标签的 shape 属性:图片选区获得焦点
- 2010Bossie大奖:十佳开源平台和中间件
- qt模型视图结构
- G1字节
- const用法大全
- 《国画》读后有感
- 利用WPF建立自适应窗口大小布局的WinForm窗口
- 笔记本电脑电池引起的故障
- sql中交叉表的实现