当前位置:首页>HTML>HTML标签>HTML <area> 标签

HTML <area> 标签

作者:微学网发布时间:2019-08-25 11:04:07

示例

带有可点击区域的图像映射:

<img src="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

定义和用法

<area>标签定义图像映射内的区域(图像映射是具有可点击区域的图像)。

<area>元素始终嵌套在<map>标记内。

注意:<img>标记中的usemap属性与<map>元素的name属性相关联,并在图像和地图之间创建关系。

浏览器支持

所有主流浏览器都支持 <area> 标签。

Chrome Firefox IE Safari Opera
Google Chrome Firefox Internet Explorer Safari Opera
支持 支持 支持 支持 支持

HTML 4.01和HTML5之间的差异

HTML5具有一些新属性,不再支持某些HTML 4.01属性。

HTML和XHTML之间的差异

HTML中,<area>标签没有结束标记。

XHTML中,必须正确关闭<area>标记。

属性

html5= HTML5中的新功能。

属性 描述
alt text 规定区域的替代文本。如果使用 href 属性,则该属性是必需的。
coords coordinates 规定区域的坐标。
downloadhtml5 filename 指定当用户单击超链接时将下载目标
href URL 规定区域的目标 URL。
hreflanghtml5 language_code 规定目标 URL 的语言。
mediahtml5 media query 规定目标 URL 是为何种媒介/设备优化的。默认:all。
nohref value HTML5 不支持。 规定没有相关链接的区域。
relhtml5 alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
规定当前文档与目标 URL 之间的关系。
shape default
rect
circle
poly
规定区域的形状。
target _blank
_parent
_self
_top
framename
规定在何处打开目标 URL。
type html5 MIME_type 规定目标 URL 的 MIME 类型。注:MIME = Multipurpose Internet Mail Extensions。

全局属性

<area>标记还支持HTML中的全局属性。

事件属性

<area>标记还支持HTML中的事件属性。

相关文章

HTML DOM参考: Area对象

默认CSS设置

大多数浏览器将使用以下默认值显示元素:

area { 
    display: none;
}