javascript - 元素之间的空白，未知来源

Question

问题已解决

在底部，在页面的最后一个元素和页脚之间，有一个空白，我正在尝试使用 Chrome 开发工具来跟踪它的来源，但显然它不是由最后一个元素和页脚引起的.

女巫中似乎空间来自的唯一元素，就是身体。body我已经取消了元素的任何边距或填充：

html,body {
margin: 0;
width: 100%;
padding: 0;
}

网站的兼容性仅通过 Chrome 进行测试

score 1 · Accepted Answer

这是因为标题的默认边距：

footer h4 {
  margin: 0;
  padding: 1em 0;
}

当您使用开发工具检查h4元素时，这一点变得很明显。

score 1 · Accepted Answer

这是由h4页脚内侧的边距引起的。现象解释如下collapsing margins：

相邻元素之间的边距折叠。简单来说，这意味着对于正常文档流中相邻的垂直块级元素，只有margin值最大的元素的margin会被尊重，而margin值较小的元素的margin会被折叠到零。

2 回答 2