页脚不停留在页面底部

Question

我有一个网页，在该网页上我使用“超大” jQuery插件来更改背景。 我还有一个页脚，仅当我放置以下CSS时才会显示该页脚：

#footer{
    width: 100%;
    color: #ffffff;
    background: #000000;
    position: fixed;
    bottom: 0px;
    height: 40px;
    padding: 5px 0px 5px 0px;
}

但是，当发生某些改变窗口高度的操作时，页面的内容将移至页脚后面，而当我向下滚动时，页脚不会停留在页面底部，而是向上滚动。

例如，我有3个div并排显示，但是当窗口调整为小于900px的宽度时，div则显示为一个在另一个下方，因此窗口高度会发生变化。 那时div跳到页脚后面，并且与它们一起向上滚动。

我尝试过position: relative和position: static ，但是即使z-index值很高，它也不会显示。 我认为此“未显示”是因为我使用了背景图片插件。 当窗口更改高度时，我也尝试了一些jquery函数，但是那里也没有结果。 有任何想法吗？ 先感谢您...

Answer 1

这是示例：

 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>

Answer 2

如果您的目标是使页脚位于“页面内容”的底部并可见，那么我建议您在CSS中分配height:100%的html标记和body标记。 另一方面，如果您希望页脚停留在“浏览器窗口/视口”的底部，则需要查找“ JONATHAN LONGNECKER”的“使用CSS放置页脚” 。 希望我有所帮助！ 雅典娜
@ athenacreations.org

页脚不停留在页面底部

问题描述

2 个解决方案

解决方案1
3 2017-01-02 16:31:31

解决方案2
1 2014-02-09 22:25:49

页脚不停留在页面底部

问题描述

2 个解决方案

解决方案1 3 2017-01-02 16:31:31

解决方案2 1 2014-02-09 22:25:49

解决方案1
3 2017-01-02 16:31:31

解决方案2
1 2014-02-09 22:25:49