静态地图上放图标2,图片添加热点

来源:互联网 发布:淘宝服装店货源网站 编辑:程序博客网 时间:2024/06/05 15:31

在图片上添加热点

代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
<img src="img/背景2.jpg" alt="" width="984" height="945" usemap="#Map"></img>
<map name="Map">
  <area shape="rect" coords="339,218,443,255" href="https://www.baidu.com" target="_blank" title="百度(纳斯达克:BIDU),全球最大的中文搜索引擎、最大的中文网站。">
  <area shape="rect" coords="203,520,303,559" href="https://www.jd.com" target="_blank" title="京东JD.COM-专业的综合网上购物商城,销售超数万品牌、4020万种商品">
  <area shape="rect" coords="653,517,755,561" href="http://www.qq.com" target="_blank" title="深圳市腾讯计算机系统有限公司成立于1998年11月">
</map>
</body>
</html>

1、首先通过ph给图片添加按钮

2、通过dw为图片添加热点


3、选择图片属性


4、选择热点画到图片上


5、效果图,此时图片上的按钮位置已经有了a标签了,可以自行处理了。


原创粉丝点击