area标签的使用

area和map一起使用

注：一般img标签通过usemap属性使用map

如下例：

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="1.html" alt="1" />
  <area shape="circle" coords="129,161,10" href ="2.html" alt="2" />
  <area shape="rect" coords="0,0,110,260" href ="3.html" alt="3" />
</map>

其中，img标签定义了usemap="#planetmap",通过map标签的id找到它，在area标签中，声明了四个属性shape表示形状，coords表示位置大小，href表示一个链接，alt属性
注：shape属性一般与coords配合使用，其中：
建议使用缩写

1. 圆形（circ或circle） coords（中心X，中心Y，半径）
2. 多边形（poly或polygon） coords（定义每个顶点的坐标值）
3. 矩形（rect或rectangle） coords（左上角点X，Y,右下角X,Y）
   shape 属性的值会影响浏览器对 coords 属性的解释。如果未使用 shape 属性，那么会假设使用值 default。依照标准，default 意味着该区域覆盖整个图像

注：alt属性包括替换说明，对于图像和图像热点是必须的。只能用于img，area，input元素中（包括applet），对于input元素表示用来替换提交按钮的图片。对于img和area表示当图片不能显示时，用alt的值来替换当前的图片。

来源：CSDN

作者：远方灬杰

链接：https://blog.csdn.net/qq_41951724/article/details/100654063