Question

我发现了很多关于这个主题的文章，但没有一篇文章对我有用，我想在内容不够大的时候在屏幕底部制作一个页脚，但是当内容长于我的页脚停留在内容下面并且不会粘在屏幕底部的屏幕。

提前致谢！

Answer 1

以下是另一个如何操作的示例，适用于所有浏览器AFAIK。 http://peterned.home.xs4all.nl/examples/csslayout1.html

编辑：我不是作者，只是在不久前看过这样的事情。

Answer 2

编辑：尝试CSS Sticky Footer：这很好，只有CSS。

如果你想进行实验，absolute CSS位置属性也可以工作。结帐MDN docs：

#footer {
    position: absolute;
    bottom: 0;
}

Answer 3

使用CSS实际上很容易做到这一点，尽管存在一些小的限制。这是一个如何完成的演示（查看获取代码的源代码）：

http://www.pmob.co.uk/temp/sticky-footer-ie8new-no-table.htm

以下是如何工作的详细说明，以备不时之需：

http://www.sitepoint.com/forums/showthread.php?171943-CSS-FAQ-Tips-etc-Please-read-before-posting!&p=1239966#post1239966

Answer 4

- 通过javascript

完成

- 示例

<div class='content'>
  your page
</div>
<div class='Footer'>Footer</div>

<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
 var document_height = $(document).height();
 var content_height = $('.content').height();

 if (content_height < document_height) {
    $('.content').css('height', (document_height));
 }
</script>

页脚底部的屏幕

4 个答案: