CSS：放置页脚

Question

  

可能重复：
  CSS sticky footer

我遇到的问题是，当页面上有少量内容时页脚会上升，当页面上有很多内容时，页脚就可以了，因为它位于底部。< / p>

所以我在页脚中写了这段代码：

position:absolute;bottom:0px;

现在当页面中有少量内容时，页脚就可以了！但是当页面中有大量内容时，页脚位于页面中间

我该如何解决这个问题？

提前谢谢。

Answer 1

底部的页脚：

1. 固定页脚高度：
   http://jsfiddle.net/EP6Hn/1/
2. 固定页脚高度＆amp;垂直对齐中间：
   http://jsfiddle.net/KUEYm/
3. 灵活的页脚高度：
   http://jsfiddle.net/QWb4H/
4. 灵活的页脚高度＆amp;垂直对齐中间：
   http://jsfiddle.net/QGFAV/
5. 底部的页脚+ PNG背景延伸到内容的高度：
   http://jsfiddle.net/EXTyU/

Answer 2

对于我的一些项目，我必须让页脚粘到页面底部。这个网站有一个很好的教程http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

本教程背后的想法是确保页面垂直填充浏览器视口。一旦你解决了这个问题，你的页脚将坚持到底部。