<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" 是图像左上角的坐标。请注意,定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。

  1. <img src="data:image.jpg" border="0" usemap="#map" alt="image" />
  2.  
  3. <map name="map">
  4. <area shape="circ" coords="100,100,30" href ="circle.html" alt="circle" target="_blank" />
  5. <area shape="poly" coords="100,30,50,180,150,170" href ="polygon.html" alt="polygon" target="_blank" />
  6. <area shape="rect" coords="0,0,200,200" href ="rectangle.html" alt="rect" target="_blank" />
  7. </map>

HTML <area> 对象的更多相关文章

  1. 浏览器端-W3School-HTML:HTML DOM Area 对象

    ylbtech-浏览器端-W3School-HTML:HTML DOM Area 对象 1.返回顶部 1. HTML DOM Area 对象 Area 对象 Area 对象代表图像映射的一个区域(图像 ...

  2. JavaScript学习笔记——DOM_document对象

    javascript-document对象详解 DOM document(html xml) object modledocument对象(DOM核心对象) 作用: 1.内容 innerHTML 2. ...

  3. [CareerCup] 14.5 Object Reflection 对象反射

    14.5 Explain what object reflection is in Java and why it is useful. Java中的对象反射机制可以获得Java类和对象的反射信息,并 ...

  4. 【转】Android Camera(五)使用Camera功能 AREA的理解

    http://blog.csdn.net/think_soft/article/details/7998478 使用Camera功能 大多数的Camera功能都是使用Camera.Parameters ...

  5. HTML:Browser 对象

    ylbtech-HTML:Browser 对象 1.返回顶部 1. Window 对象 Window 对象表示浏览器中打开的窗口. 如果文档包含框架(frame 或 iframe 标签),浏览器会为 ...

  6. 使用Camera功能 AREA的理解

    转至 http://blog.csdn.net/think_soft/article/details/7998478 使用Camera功能 大多数的Camera功能都是使用Camera.Paramet ...

  7. 浏览器根对象window之Location

    1. Location Location 对象包含有关当前 URL 的信息.Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问. 1.1 Loc ...

  8. Location - BOM对象

    Location 对象 Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问. 例子 把用户 ...

  9. location对象介绍

    Location 对象 Location 对象 Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.location 属 ...

随机推荐

  1. 【oracle 11G Grid 】Crsctl start cluster 和 crsctl start crs 有差别么?

     [oracle 11G Grid ]Crsctl start cluster 和 crsctl start crs 有差别么? q:Crsctl start cluster 是 11.2新特性和 ...

  2. oc59--匿名分类

    // // main.m // 匿名分类(延展) // 可以为某个类扩展私有的成员变量和方法,写在.m文件中, // 分类不可以扩展属性,分类有名字,匿名分类没有名字. #import <Fou ...

  3. mac os lscpu 【转】

    CPU Information on Linux and OS X This is small blog post detailing how to obtain information on you ...

  4. E20170828-mk

    utils  工具类; 效用; 实用工具; 实用菜单; Documentation  n. 记录; 证明某事属实的证据; 参考资料; 文献的编集,文件分类; receive   vt. 收到; 接待; ...

  5. js开发规范,在php上也适用

    本篇主要介绍JS的命名规范.注释规范以及框架开发的一些问题. 目录 1. 命名规范:介绍变量.函数.常量.构造函数.类的成员等等的命名规范 2. 注释规范:介绍单行注释.多行注释以及函数注释 3. 框 ...

  6. 从0开始学习BFC

    为什么需要BFC? <style> .red { background: red; } .blue { background: #1890ff; } .green { background ...

  7. Java 位运算符 &、|、^、~、<<、>>、>>>

      撸了N久的代码,但是突然冒出来个位运算,我就蒙蔽了,这是什么?我是谁?我在干什么?我在哪? 1)闲扯 关于位运算符无非也就 与(&).或(|).异或(^).取反(~).左移(<< ...

  8. HDU 4901 DP

    我觉得这个DP挺难的...然而这只是lydrainbowcat学长幻灯片上的第一题-- 明天考试要GG. 题意: 给你一个序列,让你选出两个集合S和T.保证S里的数都在T里的数的左边.求一共有多少个集 ...

  9. indeed 5.13 第二次网测

    题目描述,我找不见了,大概写一下想法和代码吧. 1. 没有看 2. 由于数据范围很小,就是简单的枚举,求全排列,然后更新答案. #include<bits/stdc++.h> #defin ...

  10. jsp页面导入excel文件的步骤及配置

    上传使用flash插件 需要jquery.uploadify.min.js,uploadify.css,poi-ooxml-3.8-20120326.jar等 jsp页面: <%@include ...