利用HTML中map标签实现整张图片带有可点击区域的图像映射:

实现效果说明:一整张背景图片,实现图标区域出现链接,可点击跳转到指定页面。

<div class="brand">
                         <img src="images/bottom.jpg" usemap="#brandimg"/>
                         <map id="brandimg" name="brandimg">
                              <area shape="rect" href="http://www.baidu.com" coords="0,0,180,50" target="_blank" alt="百度"/>
                              <area shape="rect" href="http://www.baidu.com" coords="108,0,283,50" target="_blank" alt="百度"/>
                         </map>
</div>  注解:使用usemap关联map标签,coords为图标的对角线坐标, alt表示图像加载失败时出现“百度”二字。
原文地址:https://www.cnblogs.com/kangshuai/p/4881478.html