标签：
研究了一下CSS布局以及CSS固定窗口，在此基础上设计了滚动广告。
先附上代码：（使用jquery-1.7-min）
<html> <head> <title>CSS布局及滚动广告</title> <style> #my_windows{ margin-left:2%; margin-top:20%; width:6%; height:20%; position:fixed; background-color:yellow; } #container{ width:80%; height:200%; margin:0 auto;/*设置整个容器在浏览器中水平居中*/ background-color:yellow; } #header{ height:20%; background-color:blue; } #content{ height:60%; background:#0FF; margin-top:20px; } #content_left{ height:80%; width:25%; margin:3%; background:#90C; float:left; } #content_right{ height:80%; width:63%; margin:3%; background:#90C; float:left; } #Footer{ height:16%; background:#90C; margin-top:20px; } .clear{ clear:both; } </style> <script type="text/javascript" src="jquery-1.7.1.min.js"></script> <script> $(document).ready(function(){ $("#adds").css({"margin-top":"140px"}); setInterval("manytime()",2000); }); function manytime(){ var mytest=$("#adds"); mytest.show(); mytest.css({"margin-top":"140px"}); mytest.animate({"margin-top":"0px"},1000,function(){mytest.hide()}); } </script> </head> <body> <div id="my_windows"> <p id="adds">广告</p> </div> <div id="container"> <div id="header">头部 </div> <div id="content"> <div id="content_left">左侧</div> <div id="content_right">右侧</div> </div> <div class="Clear"></div> <div id="footer">脚本</div> </div> </body> </html>
感谢博文 http://www.kwstu.com/ArticleView/divcss_2013929173533658 的CSS布局技术支持
标签：
原文地址：http://www.cnblogs.com/ILoveLinux/p/4719722.html
