<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 属性的详细解释： 对象的 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” 是图像左上角的坐标。请注意，定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。
代码语言：javascript复制<img src="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>本文采用 「CC BY-NC-SA 4.0」创作共享协议，转载请标注以下信息：
原文出处：Yiiven https://cloud.tencent.com/developer/article/2193075
