shape

HTML <area> shape 属性

带有可点击区域的图像映射：

实时编辑器

<div> <p>点击太阳或其他行星，注意变化：</p> <img src="/demo_source/planets.gif" width="145" height="126" alt="Planets" usemap="#planet_map" /> <map name="planet_map"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="/demo_source/html/sun.html" target="_blank" /> <area shape="circle" coords="90,58,3" alt="Mercury" href="/demo_source/html/mercury.html" target="_blank" /> <area shape="circle" coords="124,58,8" alt="Venus" href="/demo_source/html/venus.html" target="_blank" /> </map> </div>

<div>
  <p>点击太阳或其他行星，注意变化：</p>
  <img src="/demo_source/planets.gif" width="145" height="126" alt="Planets" usemap="#planet_map" />
  <map name="planet_map">
    <area shape="rect" coords="0,0,82,126" alt="Sun" href="/demo_source/html/sun.html" target="_blank" />
    <area shape="circle" coords="90,58,3" alt="Mercury" href="/demo_source/html/mercury.html" target="_blank" />
    <area shape="circle" coords="124,58,8" alt="Venus" href="/demo_source/html/venus.html" target="_blank" />
  </map>
</div>

结果

Loading...

---

定义和用法

shape 属性指定了区域的形状。

shape 属性与coords 属性配合，可以规定区域的尺寸、形状和位置。

---

HTML 4.01 与 HTML5之间的差异

无。

---

语法

<area shape="default|rect|circle|poly">

属性值

值	描述
default	规定全部区域。
rect	定义矩形区域。
circle	定义圆形。
poly	定义多边形区域。

---

浏览器兼容性

	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Internet	WebView Android
shape