纯CSS实现全兼容对联漂浮广告代码
本帖最后由 小麦子 于 2024-10-18 23:37 编辑纯CSS实现全兼容对联漂浮广告代码，基于DIV+CSS，没有用到任何的JavaScript代码，因些更符合WEB标准，而且它还可以同时控制多个对联广告，使你的广告代码更精简，学习CSS的朋友可能知道，这只是用到了CSS的定位功能。
演示如下：
<html>
<head>
<meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" />
<title>对联广告代码</title>
<style type="text/css">
<!--
.r1{width:180px;height:60px;background:#F5F5F5;float:right;
position:fixed !important; top/**/:200px;
position:absolute; z-index:300; top:expression(offsetParent.scrollTop+200);right:20px;}
.r2{width:180px;height:60px;background:#F5F5F5;float:right;
position:fixed !important; top/* http: */:300px;
position:absolute; z-index:400; top:expression(offsetParent.scrollTop+300);right:20px;}
.l1{width:180px;height:60px;background:#F5F5F5;float:right;
position:fixed !important; top/* www.mb5u.com */:200px;
position:absolute; z-index:300; top:expression(offsetParent.scrollTop+200);left:20px;}
.l2{width:180px;height:60px;background:#F5F5F5;float:right;
position:fixed !important; top/**/:300px;
position:absolute; z-index:400; top:expression(offsetParent.scrollTop+300);left:20px;}
-->
</style>
</head>
<body>
<table width="200" border="0" align="center" bgcolor="#f8f8f8" height="1000">
<tr>
<td>提供最新的网站建设源码、源程序、以及常用工具软件免费下载。<br><a href="http:"><span style="color: rgb(0, 0, 0); font-family: monospace; font-size: medium; white-space: pre;">牛牛论坛</span></a></td>
</tr>
</table>
<div class="r1"><a href="http://www.niuniubbs.com" target='_about'><img src="/images/logo.gif" border="0"/></a></div>
<div class="r2"><a href="http://www.niuniubbs.com" target='_about'><img src="/images/logo.gif" border="0"/></a></div>
<div class="l1"><a href="http://www.niuniubbs.com" target='_about'><img src="/images/logo.gif" border="0"/></a></div>
<div class="l2"><a href="http://www.niuniubbs.com" target='_about'><img src="/images/logo.gif" border="0"/></a></div>
</body>
</html>
页:
[1]