页脚不会停留在页面底部
我有一个网页，我使用“超大”的jquery插件来改变背景。我也有一个页脚，只有当我为它放置以下CSS时才会显示它：
#footer{
width: 100%;
color: #ffffff;
background: #000000;
position: fixed;
bottom: 0px;
height: 40px;
padding: 5px 0px 5px 0px;
}然而，当发生一些改变窗口高度的事情时，页面的内容会移到页脚后面，当我向下滚动时，页脚不会停留在页面底部--它会向上滚动。
例如，我有三个div并排显示，但当窗口的宽度小于900px时，div会一个接一个地显示，因此窗口高度会发生变化。当div移到footer后面时，它会随着div一起滚动。
我尝试过position: relative和position: static，但它甚至无法显示，即使z-index的值很高。我想这个“不显示”是因为我用来做背景图片的插件。当窗口改变高度时，我也尝试了一些jquery函数，但也没有结果。有什么想法吗？先谢谢你……
回答 2
Stack Overflow用户
发布于 2017-01-02 16:31:31
下面是一个例子：
html {
height: 100%;
}
body {
position: relative;
min-height: 100%;
}
main {
padding-bottom: 30px;
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 30px;
}<body>
<header>
header
</header>
<main>
main
</main>
<footer>
footer
</footer>
</body>
Stack Overflow用户
发布于 2014-02-09 22:25:49
如果您目标是将页脚放在“页面内容”的底部且可见，那么我建议您在CSS中为height:100%分配html标记和body标记。另一方面，如果你希望页脚停留在“浏览器窗口/视口”的底部，那么你会想要查找我已经帮助过的"Making a footer stay put with CSS" by .！
@athenacreations.org
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21665515
复制相关文章
![windows远程桌面，停留在“请稍后”页面[通俗易懂]](https://ask.qcloudimg.com/http-save/yehe-8223537/b042d5dfbf7d03f6b736c1698ec35ad4.webp)
相似问题
页脚不会停留在页面底部
页脚不会停留在页面底部
页脚不会停留在页面底部
HTML页脚不会停留在页面底部
CSS/HTML -页脚不会停留在页面底部
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
