HTML area标签 | 21xrx.com

HTML <area>标签

例子

图像映射,可点击区域:

<img src="/public/images/example_one.jpg" width="145" height="126" alt="蔬菜"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="#" alt="说明一">
  <area shape="circle" coords="90,58,3" href="#" alt="说明二">
  <area shape="circle" coords="124,58,8" href="#" alt="说明三">
</map>

定义和使用

<area>定义图片里的一块区域(可点击区域).

<area>元素总是嵌套于<map>标签里.

注意:<img>标签的usemap属性用来和<map>标签的name属性相对应,创建图片和可点击区域之间的关系.

浏览器支持

元素
<area>	支持	支持	支持	支持	支持

HTML 4.01和HTML5之间的区别

HTML5增加了些新属性,并且HTML4.01的一些属性不再支持.

HTML和XHTML之间的区别

HTML的<area>标签没有结束标签.

在XHTML里,<area>标签必须有相对应的结束标签.

属性

=HTML5新添加的属性.

属性	值	描述
alt	text	如果有href属性,指定area的可替换文本.
coords	坐标	指定area的坐标
download	文件名	指定目标可以被下载,当点击超链接时触发.
href	URL	指定area所指向的超链接
hreflang	语言代码	指定目标链接的语言
media	media query	指定对目标URL进行优化的媒体/设备.
nohref	value	HTML5不再支持. 指定area没有相关联的链接.
rel	alternate author bookmark help license next nofollow noreferrer prefetch prev search tag	指定当前文档和目标URL之间的联系
shape	default rect circle poly	指定area的形状
target	_blank _parent _self _top framename	指定在哪里打开目标链接.
type	媒体类型	指定目标链接的媒体类型

全局属性

<area>标签支持HTML全局属性

事件属性

<area>标签也支持HTML事件属性.

默认CSS设置

area { 
    display: none;
}

评论区

21技术 www.21xrx.com 备案号：蜀ICP备17043188号-2

其它

提取图片文字免费的JetBrains license services json在线解析 base64加解密文章搜索