拓展01-高度塌陷

一、产生高度塌陷的原因？

父元素没有固定高，子元素添加浮动后,父元素高度有变化.

二、解决方案

1、给父元素添加固定高度

2、清除浮动

下方元素添加清除浮动  clear: both;

3、添加清除浮动元素

若只有一个元素时, 需给此元素后面添加 一个空的块级元素
    再给新添加的空块级元素添加clear:both;

4、父元素添加

oveflow:hidden;  ----  触发BFC(格式化上下文)

5、万能清除法

E::after{
        content:"";      --- 为空
        dispaly:block;   --- 转为块元素
        clear:both;      --- 清除浮动
        height:0;        --- 高度为0
        overflow:hidden; --- 溢出隐藏
}