简述CSS什么是外边距重叠？重叠的结果是什么？
参考回答
外边距重叠是指在垂直方向上，相邻的两个元素的外边距（margin）会合并成一个较大的外边距，而不是相加。具体来说，当两个块级元素相邻时，它们之间的外边距会重叠，重叠后的外边距会取较大的值，而不是两个外边距的和。
详细讲解与拓展
外边距重叠通常发生在两个块级元素之间，尤其是没有其他内容（如边框或内边距）分隔它们时。重叠的原因是CSS规范中规定，两个垂直相邻的元素的外边距会合并，而不是简单的相加。举个例子：
<div style="margin-top: 30px; margin-bottom: 20px;"></div>
<div style="margin-top: 10px; margin-bottom: 40px;"></div>
在这个例子中，第一和第二个<div>元素相邻。它们的外边距应该是30px和10px，但由于外边距重叠的规则，最终它们之间的实际间距会是这两个外边距中的较大值，即30px，而不是30px + 10px。
外边距重叠的常见情况：
1. 相邻块级元素之间： 如两个<div>元素之间，或者<p>和<h1>之间等。
2. 空白的父容器： 如果一个容器内只有两个元素，且没有其他内容（如边框或内边距），它们的外边距也可能会重叠。
如何避免外边距重叠？
– 可以为元素添加边框（border）或内边距（padding）。这样就能防止外边距重叠，因为边框和内边距不会参与外边距的合并。
– 可以使用overflow属性设置为hidden、auto或scroll，这样也会阻止外边距重叠。
总之，外边距重叠的规则主要影响的是相邻的块级元素之间的空间，理解这一点对布局的控制非常重要。