问题对人有帮助,内容完整,我也想知道答案 0 问题没有实际价值,缺少关键内容,没有改进余地 单页面应用里,想让footer固定在底部,用的postion,然而如果文章内容超出一屏,footer就会定位在一屏的地方。如果不写html 100%的宽度,其他不足一屏的页面定位就不在页面底部了,有什么解决的方案吗? 2017年03月19日提问评论邀请回答编辑举报 提交评论 × 评论支持部分 Markdown 语法:**bold**_italic_[link](http://example.com)> 引用`code`- 列表。同时,被你 @ 的用户也会收到通知
答案对人有帮助,有参考价值 0 答案没帮助,是错误的答案,答非所问 已采纳 已解决,需要根据html定位 2017年03月21日回答评论赞赏编辑 chenby94 声望 提交评论 × 评论支持部分 Markdown 语法:**bold**_italic_[link](http://example.com)> 引用`code`- 列表。同时,被你 @ 的用户也会收到通知
答案对人有帮助,有参考价值 0 答案没帮助,是错误的答案,答非所问 用position:fixed 2017年03月19日回答1 评论赞赏编辑 minoter198 声望 提交评论 × 评论支持部分 Markdown 语法:**bold**_italic_[link](http://example.com)> 引用`code`- 列表。同时,被你 @ 的用户也会收到通知
答案对人有帮助,有参考价值 0 答案没帮助,是错误的答案,答非所问 <!DOCTYPE html> <html> <head> <style> * { margin: 0; padding: 0; } html, body { height: 100%; } div { position: relative; min-height: 100%; } footer { position: absolute; bottom: 0px; background: grey; width: 100%; height: 50px; } p { height: 2000px; } </style> </head> <body> <div> <p></p> <footer>123</footer> </div> </body> </html> 是要这样? 2017年03月19日更新1 评论赞赏编辑 quietwait371 声望 提交评论 × 评论支持部分 Markdown 语法:**bold**_italic_[link](http://example.com)> 引用`code`- 列表。同时,被你 @ 的用户也会收到通知
答案对人有帮助,有参考价值 0 答案没帮助,是错误的答案,答非所问 一般来说如果要用到百分比布局必须为html和body加上宽高100%你知道嘛?有一种布局方案是用flex来布局 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> * { margin: 0; padding: 0; } html,body { width: 100%; height: 100%; } .page { width: 100%; height: 100%; display: flex; /*使得内部元素竖直排列*/ flex-direction: column; } .content { /*将剩余空间全部填满*/ flex: 1; background: #f00; width: 100%; } .footer { height: 100px; width: 100%; background: #ff0; } </style> </head> <body> <div class="page"> <div class="content"></div> <div class="footer"></div> </div> </body> </html> 效果: 2017年03月19日更新评论赞赏编辑 _gjy_382 声望 提交评论 × 评论支持部分 Markdown 语法:**bold**_italic_[link](http://example.com)> 引用`code`- 列表。同时,被你 @ 的用户也会收到通知