例
图像映射,可点击方面:
<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>标记。
注意: usemap在属性<img>标记与相关联的<map>元素的name属性,并创建图像和地图之间的关系。
浏览器支持
元件 | |||||
---|---|---|---|---|---|
<area> | 是 | 是 | 是 | 是 | 是 |
HTML 4.01和HTML5之间的差异
HTML5有一些新的属性,以及一些HTML 4.01属性都不再支持。
HTML和XHTML之间的差异
在HTML中的<area>标签没有结束标签。
在XHTML中的<area>标签必须正确关闭。
属性
=新的HTML5。
属性 | 值 | 描述 |
---|---|---|
alt | text | 指定区域的替代文本。 如果需要的href属性存在 |
coords | coordinates | 指定区域的坐标 |
download | filename | 指定当用户点击超链接的目标将被下载 |
href | URL | 指定的超链接目标区域 |
hreflang | language_code | 指定目标URL的语言 |
media | media query | 指定的介质/设备的目标URL被优化 |
nohref | value | 在HTML5不支持。 指定一个区域没有相关链接 |
rel | 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 | media_type | 指定目标URL的媒体类型 |
全局属性
在<area>标签支持全局的HTML属性 。
事件属性
在<area>标签支持的HTML事件属性 。
相关页面
HTML DOM参考: Area对象
默认设置CSS
大多数浏览器会显示<area>元素与以下默认值:
area {
display:
none;
}