高度塌陷的解决方法

        在文档流中父元素的高度默认是被子元素撑开的，也就是子元素多高，父元素就是多高但是当为子元素设置浮动以后，子元素会完全脱离文档流，此时导致子元素无法撑起父元素，导致父元素塌陷。由于父元素的高度塌陷了，则父元素下面的元素都会向上移动，这样将会导致页面布局混乱的。

       所以在开发中一定要避免出现塌陷问题，解决塌陷问题：

              1、我们可以将父元素的高度写死，以避免塌陷的问题出现，但是一旦写死父元素高度，父元素的高度将不能自动适应子元素的高度，所以这种方案是不推荐使用的。

       根据W3C标准，在页面中元素都有一个隐含的属性叫做Block Formatting Context 简称(BFC)，该属性可以设置打开或关闭，默认是关闭的，当开启元素的BFC后，元素将会具有如下的特性：

1、父元素的垂直外边距不会和子元素重叠

2、开启BFC的元素不会被浮动元素所覆盖

3、开启BFC的元素可以包含浮动的子元素

       如何开启元素的BFC：

1、设置元素的浮动