HTML DOM Area 对象

HTML 中的 <area> 元素用于定义图像映射的可点击区域,通常与 <map> 元素一起使用。<area> 元素可以定义矩形、圆形或多边形等不同形状的区域,以便用户可以在图像的不同部分执行不同的操作。

属性

<area> 元素支持以下常用属性:

  • alt: 定义区域的替代文本,当图像无法显示时将显示这段文本。
  • coords: 定义区域的坐标,具体取决于不同形状的区域。
  • href: 定义区域被点击时要跳转的链接地址。
  • shape: 定义区域的形状,可以是 "rect"(矩形)、"circle"(圆形)或 "poly"(多边形)。
  • target: 定义链接的打开方式,如在新窗口中打开。

示例

以下是一个使用 <area> 元素创建图像映射的示例:

-- -------------------- ---- -------
--------- -----
------
------
    ------------ --- ---------------
-------
------
    ---- ----------------- -------------- ------------ ----- ---- --
    ---- ------------
        ----- ------------ ------------------ ----------------- --------- -- --
        ----- -------------- ------------------- ----------------- --------- -- --
        ----- ------------ -------------------------------- ----------------- --------- -- --
    ------
-------
-------

在上面的示例中,我们创建了一个图像映射,分别定义了一个矩形区域、一个圆形区域和一个多边形区域,并为每个区域指定了对应的链接地址。用户可以点击不同的区域来跳转到不同的页面。

<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
上一篇: HTML 对象 <a>
下一篇: HTML 对象 <audio>
纠错
反馈