1
条回答
写回答
写回答
-
<!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>2019-07-17 19:16:33赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
问答排行榜
最热
最新
推荐问答
