CSS 外边距合并

创建于 2024-12-03 / 60
字体: [默认] [大] [更大]

外边距合并

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

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

请看以下示例:

实例

演示外边距合并:

h1 {
  margin: 0 0 50px 0;
}

h2 {
  margin: 20px 0 0 0;
} 亲自试一试 »

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

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


CSS 习题和测验

测验 1 » 测验 2 » 测验 3 » 测验 4 »

所有 CSS 外边距属性

属性 描述
margin 用于在一条声明中设置外边距属性的简写属性。
margin-bottom 设置元素的下外边距。
margin-left 设置元素的左外边距。
margin-right 设置元素的右外边距。
margin-top 设置元素的上外边距。


0 人点赞过