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

双边距重叠问题

1. 什么是双边距重叠

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

2. 折叠结果

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

3. 如何解决双边距重叠

• 给其中的一个div添加一个父的div，并且为这个div设置边框或者实现overflow：hidden；
• 将块级div设置成行内div（display：inline-block；）