前端面试题HTML+CSS基础篇——双边距重叠

双边距重叠问题

1. 什么是双边距重叠

多个相邻的(兄弟或者父子关系)标准流中的块元素垂直方向的margin会重叠。

2. 折叠结果

两个相邻的外边距都是正数的时候,折叠结果就是它们两者之间较大的值
两个相邻的外边距都是负数的时候,折叠结果就是它们两者之间绝对值的较大值
两个相邻的外边距一正一负的时候,折叠结果就是它们两者相加的和

3. 如何解决双边距重叠

  • 给其中的一个div添加一个父的div,并且为这个div设置边框或者实现overflow:hidden;
  • 将块级div设置成行内div(display:inline-block;)
©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页