位置:主页 > 最近文章 >

对网页中层的固定实现代码

作者:admin时间:2018-09-11
对于DIV+CSS不熟悉的我,为此加班加点在项目上线时把问题解决了。参考代码如下: 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html"; charset="GBK"/> <title>固定上下层的位置</title> <style type="text/css"> <!-- body { background-image: url(0); background-attachment: fixed; } #BottomNav { background: #9F6; z-index: 999; position: fixed; bottom: 0; left: 0; width: 100%; height: 30px; position:fixed; top: expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight); overflow: visible; } #topNavWrapper { height: 30px; margin: 0px auto; width:100%; z-index:100; position:fixed ; top:0px; left:0; background: #9F6; } #center { width: 100%; height:100%; padding-top:30px; padding-bottom:30px; } --> </style> </head> <body> <div id="topNavWrapper">固定悬浮导航在此处,不随滚动条的滚动变化</div> <div id="center"> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> <p>我是中间层</p> </div> <div id="BottomNav">固定悬浮导航在此处,,不随滚动条的滚动变化</div> </body> </html>

本文源自: AG环亚游戏

上一篇:没有了

下一篇:js 获取计算后的样式写法及注意事项

最近文章

联系我们