网页制作 
首页 > 网页制作 > 浏览文章

CSS控制DIV永远固定在页面底部不随滚动而滚动

(编辑:jimmy 日期: 2024/5/20 浏览:3 次 )

复制代码代码如下:
<style type="text/css">
html,body {
width:100%;
height:100%;
margin:0px;
padding:0px;
overflow:hidden;
}
#Main {
position:absolute;
bottom:0px;
left:0px;
width:100%;
height:100%;
overflow:auto;
z-index:1;
}
#ToolBar {
position:absolute;
bottom:0px;
right:16px;
width:100%;
height:100px;
text-align:center;
BACKGROUND-IMAGE: url(http://hi.csdn.net/attachment/201101/18/7494075_1295323598v2Ii.png);
z-index:2;
overflow:hidden;
}
</style>
<div id="Main">
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
<p>www.baidu.com</p><p>www.baidu.com</p><p>www.baidu.com</p>
</div>
<div id="ToolBar">CSS控制DIV永远固定在页面底部</div>
上一篇:Web页面布局方式小结
下一篇:CSS定位的几个类型简单介绍
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网