父子元素margin塌陷和兄弟盒子外边距重叠

外边距重叠（margin-collapse）：

相邻的两个盒子（可能是兄弟关系也可能是祖先关系）的外边距可以结合成一个单独的外边距。这种合并外边距的方式被称为折叠，并且因而所结合成的外边距称为折叠外边距，折叠结果遵循下列计算规则：

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

解决垂直兄弟盒子外边距重叠

1.给下面的元素
position设置为absolute或者fixed
2.下面的元素设置左浮动
（1,2)会影响后面的元素
3.给下面的元素设置display:inline-block
4.其中一个元素外套一个div并设置overflow:hidden;

解决父子嵌套margin塌陷

1.给父元素设置border
2.给父元素设置padding
3.给父元素设置overflow：hidden
4.给父元素设置position:absolute/fixed
5.给父元素设置display:table
6.给父元素设置display:inline-block;
7.给父元素设置float:left/right;