搜技巧 | 只提供最简单有效的方法与技巧

分享简单实用的方法与技巧
当前位置:搜技巧 > 网站开发 >


专题页面上有多个按钮,要怎么做链接

  在做网站专题页时,当一个页面上有多个按钮,如何做按钮链接?

  前言:用Dreamweaver的热点链接,虽然方便,但是兼容性差!

  演示页面:http://www.merrystone.cn/huodong/wedding/

  那么怎么做,才能使得兼容各浏览器?

  1.在页面上写入CSS样式:

  .bg{width: 100%;height: auto;position: relative;}

  .bg a{position: absolute;display: block;height: 5%;width: 8.5%;border:1px solid #f00;}

  .bg a.link1{top: 84%;right: 20.5%;}

  .bg a.link2{top: 72.9%;right: 25.1%; }

  .bg a.link3{top: 47%;left: 21.3%;}

页面上有多个按钮做链接

  2.页面HTML代码使用说明:

  使用 .bg 样式来定位你要添加按钮链接的 图片 位置,例如图片1.jpg,就是

  <div class="bg"><img src="img/1.jpg"></div>

  使用 .bg a 样式来定位你要添加链接的 按钮 位置,具体如下

        <div class="bg">
           <img src="img/1.jpg">
           <a class="link1" href="http://www.soujiqiao.com"></a>
        </div>

        其中,link1、link2、link3 分别对应按钮1、按钮2、按钮3的链接位置

分享:
如果文章帮助到你了,请点击打打赏小搜下小搜,感谢!

相关推荐