请选择 进入手机版 | 继续访问电脑版

Bacysoft.cn

 找回密码
 邀请注册
查看: 8369|回复: 0

带关闭功能的浮动对联广告框的CSS写法(兼容所有主流浏览器)

[复制链接]
发表于 2012-6-7 20:17:48 | 显示全部楼层 |阅读模式
对联广告在很多网站都有,使用 CSS 就能完美实现,下面是 CSS 代码:

  1.         .a_fl, .a_fr { float: right; position: fixed; top: 20px; z-index: 100; }
  2.         .a_fl { left: 0; }
  3.         .a_fr { right: 0; text-align: right; }
  4.         * html .a_fl, * html .a_fr { position: absolute; top: expression(offsetParent.scrollTop+20);  }
  5.         .a_fl a, .a_fr a { display:block; font-size:10px; text-align:center; }
复制代码
.a_fl:左浮动对联
.a_fr:右浮动对联
*html:用于 IE6 的兼容
其他具体属性的内容,可以参考 CSS 相关手册。

使用方法:

  1. <div class="a_fl">
  2.         <a href="javascript:;" onclick="this.parentNode.style.display='none'">X Close</a>
  3.         <!-- 此处放置广告 JS 代码或者其他需要的内容 -->
  4. </div>

  5. <div class="a_fr">
  6.         <a href="javascript:;" onclick="this.parentNode.style.display='none'">X Close</a>
  7.         <!-- 此处放置广告 JS 代码或者其他需要的内容 -->
  8. </div>
复制代码
本站在线图书馆http://www.bacysoft.cn/myapp/ebook/index.php)以及纪念日计时器http://www.bacysoft.cn/myapp/memorialday/index.php)均采用了此对联广告,欢迎访问!
您需要登录后才可以回帖 登录 | 邀请注册

本版积分规则



京ICP备08000958号-1|腾讯云|阿里云|联系方式|Bacysoft.cn

GMT+8, 2021-4-17 19:35 , Processed in 0.016160 second(s), 23 queries , Gzip On.

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表