快来看啊'盒子'-->'塌陷' 我人麻了啊~!

导致塌陷的主谋----浮动

真相 : 盒子塌陷当父元素没设置足够大小的时候，而子元素设置了浮动的属性，子元素就会跳出父元素的边界（脱离文档流），尤其是当父元素的高度为auto时，而父元素中又没有其它非浮动的可见元素时，父盒子的高度就会直接塌陷为零， 我们称这是CSS高度塌陷。

两大情况:

1.第一种情况 :

两个同级元素,垂直排列,上面的盒子给margin-bottom 下面的盒子给margin-top,那么他们两个的间距会重叠会以大的那个计算.

2.第二种情况:

两个父子元素,内部的盒子给margin-top,其父级也会收到影响,同时产生上边距,父子元素会进行粘连

解决方案:

1.给父子设置border,把border设为透明色,1px

2.为父盒子添加overflow:hidden

3.为父盒子设padding值

4.为父盒子添加固定定位

5.为父盒子添加display:table