2020-11-03

高度塌陷的产生和解决方法
高度塌陷的产生条件:父元素没有设置高度，所有子元素都浮动

1.给父元素设置高度，此方法适合高度固定的布局
2.给父元素添加属性overflow: hidden
3.在所有浮动的元素后面添加内容为空的块元素，并且添加声明clear:both; height:0;overflow:hidden;(添加height：0；和overflow：hidden；是为了避免这个空标签如果是li的话，浏览器有默认高度。一般使用clear：both即可。)
4.万能清除法：
给高度塌陷的元素添加伪对象（伪元素）:after，并声明{content:’’;display:block;clear:both;overflow:hidden;height:0;visibility:hidden;}
给高度塌陷的元素添加声明{zoom:1}
5.给父元素添加声明overflow:auto;zoom:1;(zoom:1解决IE6的兼容，overflow：auto 单独使用高度不显示的问题。若不考虑IE兼容，可不写)
6. 给父元素添加声明 display:table;
7. 父元素一起浮动
8. 所有的子元素后面加 br标签并定义样式 clear:both.父元素添加zoom:1;