如何将页脚放在页面底部或内容下方

Question

我希望我的页脚始终位于页面底部，因为我的页面不长。

但是当页面长于屏幕时，它需要像内页一样位于内容之下，而不是卡在屏幕底部。

Answer 1

如果您的页脚具有固定的高度，那么最简单且仅限CSS的解决方案就是：

<强> CSS

html {
    position: relative;
    min-height: 100%;
}

body {
    /* height of the footer */
    margin: 0 0 120px 0;
}

footer {
    position: absolute;
    bottom: 0;
    height: 120px;
}

<强>样本

• Try it with short content
• Try it with a lot of content

Answer 2

这可能会有所帮助;

jQuery Sticky Footer

demo