HTML <area> 对象
<area>对象的属性
| 属性 | 描述 | W3C |
| alt | 设置或返回当浏览器无法显示某个区域时的替换文字。 | Yes |
| coords | 设置或返回图像映射中可点击区域的坐标。 | Yes |
| hash | 设置或返回某个区域中 URL 的锚部分。 | Yes |
| host | 设置或返回某个区域中 URL 的主机名和端口。 | Yes |
| hostname | 设置或返回href属性值得主机部分。 | Yes |
| href | 设置或返回某个区域中href属性值 | Yes |
| noHref | 设置或者返回某个区域的 nohref 属性值。 | Yes |
| pathname | 设置或者返回某个区域 href 属性值的路径名部分。 | Yes |
| port | 设置或者返回某个区域 href 属性值的端口部分。 | Yes |
| protocol | 设置或者返回某个区域 href 属性值的协议部分。 | Yes |
| search | 设置或者返回某个区域 href 属性值的查询字符串部分。 | Yes |
| shape | 设置或者返回某个区域 shape属性值。 | Yes |
| target | 设置或者返回某个区域 target 属性值。 | Yes |
<area> 对象 coords 属性的详细解释:
<area> 对象的 coords 属性定义了客户端图像映射中对鼠标敏感的区域的坐标。坐标的数字及其含义取决于 shape 属性中决定的区域形状。可以将客户端图像映射中的超链接区域定义为矩形、圆形或多边形等。
下面列出了每种形状的适当值:
圆形:shape="circ",coords="x,y,radius"
这里的 x 和 y 定义了圆心的位置("0,0" 是图像左上角的坐标),r 是以像素为单位的圆形半径。
多边形:shape="poly",coords="x1,y1,x2,y2,x3,y3,...,xn,yn"
每一对 "x,y" 坐标都定义了多边形的一个顶点("0,0" 是图像左上角的坐标)。定义三角形至少需要三组坐标;高纬多边形则需要更多数量的顶点。
多边形会自动封闭,因此在列表的结尾不需要重复第一个坐标来闭合整个区域。
矩形:shape="rect",coords="x1,y1,x2,y2"
第一个坐标是矩形的一个角的顶点坐标,另一对坐标是对角的顶点坐标,"0,0" 是图像左上角的坐标。请注意,定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。
<img src="data:image.jpg" border="0" usemap="#map" alt="image" /> <map name="map">
<area shape="circ" coords="100,100,30" href ="circle.html" alt="circle" target="_blank" />
<area shape="poly" coords="100,30,50,180,150,170" href ="polygon.html" alt="polygon" target="_blank" />
<area shape="rect" coords="0,0,200,200" href ="rectangle.html" alt="rect" target="_blank" />
</map>
HTML <area> 对象的更多相关文章
- 浏览器端-W3School-HTML:HTML DOM Area 对象
ylbtech-浏览器端-W3School-HTML:HTML DOM Area 对象 1.返回顶部 1. HTML DOM Area 对象 Area 对象 Area 对象代表图像映射的一个区域(图像 ...
- JavaScript学习笔记——DOM_document对象
javascript-document对象详解 DOM document(html xml) object modledocument对象(DOM核心对象) 作用: 1.内容 innerHTML 2. ...
- [CareerCup] 14.5 Object Reflection 对象反射
14.5 Explain what object reflection is in Java and why it is useful. Java中的对象反射机制可以获得Java类和对象的反射信息,并 ...
- 【转】Android Camera(五)使用Camera功能 AREA的理解
http://blog.csdn.net/think_soft/article/details/7998478 使用Camera功能 大多数的Camera功能都是使用Camera.Parameters ...
- HTML:Browser 对象
ylbtech-HTML:Browser 对象 1.返回顶部 1. Window 对象 Window 对象表示浏览器中打开的窗口. 如果文档包含框架(frame 或 iframe 标签),浏览器会为 ...
- 使用Camera功能 AREA的理解
转至 http://blog.csdn.net/think_soft/article/details/7998478 使用Camera功能 大多数的Camera功能都是使用Camera.Paramet ...
- 浏览器根对象window之Location
1. Location Location 对象包含有关当前 URL 的信息.Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问. 1.1 Loc ...
- Location - BOM对象
Location 对象 Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问. 例子 把用户 ...
- location对象介绍
Location 对象 Location 对象 Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.location 属 ...
随机推荐
- Mysql查看sql是否走事务
登陆进入server [root@gzmtest_25 ~]# su - mysql [mysql@gzmtest_25 ~]$ mysql.local Welcome to the MySQL mo ...
- log4net preserveLogFileNameExtension 和 watch
preserveLogFileNameExtension <log4net> <appender name="fileappender" type="l ...
- case when in sql server's stored procedure
https://docs.microsoft.com/en-us/sql/t-sql/language-elements/case-transact-sql Evaluates a list of c ...
- Codeforces--630A--Again Twenty Five! (水题)
Again Twenty Five! Time Limit: 500MS Memory Limit: 65536KB 64bit IO Format: %I64d & %I64u ...
- java 分布式锁
转自:http://www.hollischuang.com/archives/1716 目前几乎很多大型网站及应用都是分布式部署的,分布式场景中的数据一致性问题一直是一个比较重要的话题.分布式的CA ...
- 洛谷 P1081 开车旅行 —— 倍增
题目:https://www.luogu.org/problemnew/show/P1081 真是倍增好题! 预处理:f[i][j] 表示从 i 点开始走 2^j 次 AB (A,B各走一次)到达的点 ...
- SQLyog 快捷方式
连接Ctrl+M 创建新连接Ctrl+N 以当前连接属性创建新连接Ctrl+F4/Ctrl+W 断开当前连接Ctrl+Tab 切换到下一个连接Ctrl+Shift+Tab 切换到上一个连接Ctrl+1 ...
- C# Area 双重路由如何写
在WebApi项目里面 一般除了接口, 还有管理端...一些乱七八糟的,你想展示的东西, 一种做法是分开写: 比如管理后台一个项目, 然后接口一个, 然后页面一个, 其实这样做也可以,但是这么做, 无 ...
- 自学Python七 爬虫实战一
此文承接上文,让我们写一个简简单单的爬虫,循序而渐进不是吗?此次进行的练习是爬取前5页什么值得买网站中的白菜价包邮信息.包括名称,价格,推荐人,时间. 我们所需要做的工作:1.确定URL并获得页面代码 ...
- CORS 和 JSONP
跨域资源共享(CORS) 它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制. CORS(Cross-Origin Resource Sharing) ...