想知道高度塌陷问题及其解决方法么~~~

一。高度塌陷问题

        在浮动布局中，父元素的高度默认是被子元素撑开的，

        当子元素浮动后，其会完全脱离文档流，

        将会无法撑起父元素的高度，导致父元素的高度丢失。

二。利用BFC解决高度塌陷问题

        BFC  块级格式化环境

                BFC是一个CSS中隐含的属性，可以为一个元素开启BFC；

                 开启BFC的元素，会变成一个独立的布局区域；

         元素开启BFC后特点：

                  1.开启BFC的元素，不会被浮动元素所覆盖；

                  2.开启BFC的元素，子元素与父元素的外边距不会重叠；

                  3.开启BFC的元素 ，可以包含浮动的子元素；

           开启BFC的方式：

                    1.设置浮动 （不推荐）

                    2.将元素设置为行内块元素（不推荐）

                    3.将元素的overflow设置为非visible值

                               常用方式：overflow:hidden

利用BFC解决高度塌陷问题的实例：

 三。clear属性

 

由于box1浮动，导致box3上移，可以通过clear属性来清除浮动元素对当前元素所产生的影响。

         clear： 作用：清除浮动元素对当前元素所产生的影响

             可选值：left     清除左侧元素浮动对当前元素的影响；

                           right   清除右侧元素浮动对当前元素的影响；

                           both    清除两侧中最大大的；

解决方法：