如何在页面底部制作页脚？

Question

我网站上有一些页面内容很少，

the content height + footer height < one screen height

见下图：

所以我的问题是，当我的内容高度不足以覆盖整个页面时，如何在页面底部制作页脚？

PS：我不希望页脚页面固定在底部。

Answer 1

http://jsfiddle.net/yvZaV/1/

<div class="wrapper">
    <div>content here, this will push the footer down the page if it is needed</div>
    <footer>footer here</footer>
</div>

html, body {
    height:100%;
    min-height:100%;
}
.wrapper {
    position:relative;
    min-height:100%;
}
footer {
    position:absolute;
    bottom:0px;
    width:100%;
    background-color:red;
}

Answer 2

您可以将min-height设置为您的内容，您可以设置为像素或％

.content{
    min-height: 100%;
}

http://jsfiddle.net/yvZaV/2/