html - 可调节高度的粘性页脚

Question

我试图在我的页面上有一个粘性页脚，但与我以前看到的相比有所不同。

页脚的顶部始终在内容后 50 像素处保持粘性，而绿色则填充页脚的其余部分，直到页面结束。

您可以在http://enviro2012.tapagecommunication.com上查看示例

如果您单击页面底部 Facebook 插件中的“发送”按钮，问题会更好地说明。

如果您需要更多信息，请告诉我！:)

谢谢！

Answer 1

我以前有过这个。我尝试了各种方法，包括根据页脚的垂直位置检查窗口高度，然后将页脚高度设置为差异。它在大多数浏览器中的效果都不算太差。

然而，最简单（也是快速渲染）的解决方案是在页脚中添加足够的底部填充以覆盖大多数窗口大小的间隙。假设您的内容总是会填满页面的大部分，那么几百像素应该就足够了——并且在页面第一次加载时就可以正确呈现。