Html 如何去除底部的空白？

有人能帮我消除这个网站底部多余的空白吗

此图显示了我试图删除的内容：

下面是如何设置页脚的

html, body { height: 100%; }
body > #wrapper { height: auto; min-height: 100%; }
#footer { position: relative; height: 140px; z-index: 10; clear: both;
    margin-top: -140px; background: #700; color: #fff; }

---

尝试增加页脚的高度：

#footer { height: 145px; }

---

尝试将页脚和/或正文底部的填充和/或边距设置为零。

尝试使用定位：

#footer {
  position: absolute;
  bottom: 0;
}

您应该添加：

#footer .content p {
    margin-bottom: 0
}

---

事实上，我在那之前写了另一个答案，解释了正确的情况，并提供了一个替代的解决方案，如下所示：

您应该将

溢出：隐藏

添加到

#页脚

这将解决问题，即

内部

p

元素上的

边距

通过

#页脚

折叠。请参阅：

如果您觉得这不太可能，请尝试添加以下内容，看看会发生什么：

---

在页脚类中进行更改

 height: 160px;

试试……

试试这个： 在“body”元素（不包括页脚）中的每个HTML元素周围添加一个包装器，然后在CSS中执行以下操作：

.wrapper {
    min-height: calc(100vh -<your-footer-height>px);
}

.wrapper{
最小高度：计算（100vh-px）；
}

---

您不必向页脚添加任何样式，因为它不在包装器中。因此，内容仅取设备屏幕的视口高度。

将其放入您的CSS部分

min-height: 100vh;

---

是否将html和正文上的边距和填充设置为0？（我的CSS已经严重生锈了，因此用注释代替答案…）好吧，它确实有效：）如果你有兴趣知道差距来自哪里，请阅读我的答案。我将使用thirtydot的实现，但这同样有效。我发誓我昨晚试了很多东西，包括这个，但我一定错过了什么。谢谢。@Bitguru，他的解决方案实际上解决了根本问题，我的解决方案更像是一个补丁。你和他一起去是对的：）谢谢你的评论谢谢！我选择了overflow:hidden解决方案。顺便说一下，那篇解释边距崩溃的文章非常有用。谢谢你的推荐！太棒了！谢谢

min-height: 100vh;