<area> - Tags Reference介绍 首页HTML<面积>

HTML<area>标签用于定义图像映射中的区域。

area 示例

<!DOCTYPE html>
<html>

   <head>
      <title>HTML area Tag</title>
   </head>

   <body>
      <img src=/images/usemap.gif alt="usemap" border="0" usemap="#tutorials"/>
      
      <map name="tutorials">
         <area shape="poly" coords="74,0,113,29,98,72,52,72,38,27"
            href="/perl/index.htm" alt="Perl Tutorial" target="_blank" />
         
         <area shape="rect" coords="22,83,126,125" alt="HTML Tutorial"
            href="/html/index.htm" target="_blank" />
         
         <area shape="circle" coords="73,168,32" alt="PHP Tutorial"
            href="/php/index.htm" target="_blank" />
      </map>
   </body>

</html>

这将产生以下结果-

全局属性

此标签支持 HTML 的全局属性。

特定属性

HTML<area>标签还支持以下附加属性-

AttributeValue描述
alttext指定该区域的备用文本。
coords

if shape="rect" then coords="left, top, right, bottom"

if shape="circ" then coords="centerx, centery, radius"

if shape="poly" then coords="x1, y1, x2, y2,..,xn, yn"

指定适合shape属性的坐标,以定义图像映射的图像区域。
downloadhtml-5filename指定当用户单击超链接时下载目标。
hrefURL指定页面的URL或链接指向的锚点的名称。
hreflang html-5language_code指定目标URL的语言。
media html-5media query指定目标URL针对其优化的媒体/设备。
nohreftrue/false从图像地图中排除区域
rel html-5alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
指定当前文档和目标URL之间的关系
shaperect
rectangle
circ
circle
poly
polygon
指定图像地图的形状
target_blank
_parent
_self
_top

打开目标URL的位置。

_blank -  新窗口打开

_parent - 父窗口打开

_self - 当前窗口打开

_top - 整个窗口打开

type html-5mime_type指定目标URL的MIME类型。

事件属性

此标签支持 HTML 的事件属性。

浏览器支持

ChromeFirefoxIEOperaSafariAndroid
YesYesYesYesYesYes

这一章你学到了什么?做个笔记,好记忆不如烂笔头! 请将遇到的问题写入评论区中,大家一起进步。

祝学习愉快!(您也可以 选中需要修改的内容->右键->进行编辑)

点我分享笔记