根据高度，使网站页脚粘贴到页面底部或内容下方？

Question

On my site如果内容小于窗口高度或大屏幕（我可以使用position：absolute），我想让页脚粘到页面底部。如果内容较大（现在就是这样），我希望它位于我的内容之下。我知道如何这样做，但不知道如何混合两者。

我该怎么做？我需要使用JavaScript还是可以使用纯CSS？

Answer 1

有很多方法可以实现它。 您可以查看以下链接：

http://css-tricks.com/snippets/css/sticky-footer/

http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

Answer 2

1。当内容较少时，页脚会停留在底部：

Fiddle 1

2。当内容超出屏幕/窗口高度时，页脚会低于内容：

Fiddle 2

<强> CSS

html,body,#container{
    width:100%;
    height:100%;
    margin:0px;
    padding:0px;
}
#container{
    display:table;
}
#content{
    display:table-row;
    height:100%;
}
#footer{
    min-height:45px;
}

Answer 3

有些人已经问了一个类似的问题答案是在CCS，我希望这有帮助。

#element-align {
    position: fixed;
    bottom: 0;
}

有关详细信息，请参阅下面的链接 https://stackoverflow.com/a/6029162/3324507