<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> 对象的更多相关文章

  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. 《python源代码剖析》笔记 Python虚拟机框架

    本文为senlie原创,转载请保留此地址:http://blog.csdn.net/zhengsenlie 1. Python虚拟机会从编译得到的PyCodeObject对象中依次读入每一条字节码指令 ...

  2. Android实战简易教程-第十五枪(实现ListView中Button点击事件监听)

    1.main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" x ...

  3. P1155 双栈排序(二分图染色)

    P1155 双栈排序(二分图染色) 题目描述 Tom最近在研究一个有趣的排序问题.如图所示,通过2个栈S1和S2,Tom希望借助以下4种操作实现将输入序列升序排序. 操作a 如果输入序列不为空,将第一 ...

  4. Django day08 多表操作 (三) 基于对象的跨表查询 基于双下划线的多表查询

    一: 基于对象的跨表查询 1. 一对一 正向: 反向: 2. 一对多 正向: 反向: 3.多对多 正向: 反向: 4.*****基于对象的多表查询 二: 基于双下划线的多表查询 1. 连表查询 一对一 ...

  5. Linux-防火墙设置-centos6.10版

    cd /etc/sysconfig vi iptables 输入i进入编辑模式 打开下图,并按照下图修改 输入esc退出编辑模式 输入保存命令:[:w] 输入退出命令:[:q] 重启防火墙 servi ...

  6. DotNetCasClient加载失败问题分析

    最近公司在接入整理单点登录方案的时候,选择了CAS方案,实际版本采用了4.0.当我们把服务端附属完毕,基于.NET平台Web版的客户端DotNetCasClient进行定制化修改后,在测试环境通过.然 ...

  7. elasticearch 归并策略

    归并线程配置 segment 归并的过程,需要先读取 segment,归并计算,再写一遍 segment,最后还要保证刷到磁盘.可以说,这是一个非常消耗磁盘 IO 和 CPU 的任务.所以,ES 提供 ...

  8. 轻量数据库SQLiteDataBase的相关操作方法

    一.查询操作: 查询操作比较复杂,主要有如下操作: db.rawQuery(String sql, String[] selectionArgs); db.query(String table, St ...

  9. 用JSP实现动态交互

    一.什么是JSP? 1.在HTML中嵌入Java脚本代码 2.由应用服务器中的JSP引擎来编译和执行嵌入的Java脚本代码 3.然后将生成的整个页面信息返回给客户端   二.为什么需要基于B/S技术的 ...

  10. session 存入redis 或 memcache 的方法

      Session简介 session,中文经常翻译为会话,其本来的含义是 指有始有终的一系列动作/消息,比如打电话时从拿起电话拨号到挂断电话这中间的一系列过程可以称之为一个session.有时候我们 ...