CSS 外边距合并

外边距合并

外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。

合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

请看以下示例:

h1 {
  margin: 0 0 50px 0;
}

h2 {
  margin: 20px 0 0 0;
}

在上面的例子中，<h1> 元素的下边距为50px，<h2> 元素的上边距设置为20px。

常识似乎表明，<h1> 和<h2> 之间的垂直边距总计为 70px （50px+20px）。 但由于外边距合并，实际间距为 50px.

所有 CSS 外边距属性