1 会产生塌陷的三种情况
1）相邻元素之间（上下相邻会塌陷，左右不会塌陷）
2）子元素紧贴父元素的最外边时，子元素的margin外边距会影响父元素
3）空的块元素中没有任何东西，则上下外边距折叠
2 解决方案
2.1 首先解释BFC：
BFC（Block Formatting Context）块级格式化上下文
概念：是在CSS的布局中的一个概念，是一个独立的区域，与外界不影响
作用：BFC是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面元素
①阻止元素被浮动元素覆盖
②可以包含浮动元素--------------将内部浮动的元素包含在块里，防止对外部产生影响（覆盖）
③解决上下块级元素外边距重叠
触发条件：
【1】根元素，即HTML元素
【2】float的值不为none
【3】overflow的值不为visible
【4】display的值为inline-block、table-cell、table-caption
【5】position的值为absolute或fixed
2.2 问题一方案：
在其中一个子元素外面套一个div，用外面的div来触发BFC，就不会外边距重叠
2.3 问题二方案：
1. 给父元素设置padding，border（不让子元素边与父元素边完全重合就行）
2. 子元素overflow的值不为visible
2.4 问题三：
一般不会碰到这种情况