高度塌陷解决方法

案例 :父高自适应,子浮动,父高为0的表现

1、伪元素清除浮动

2、双伪元素清除浮动

/*声明清除浮动的样式*/
 .clearfix:after {
 	content: "";		
 	display: block; 	// 没有内容转换为快元素
  	clear: both;		// 清除浮动
 	visibility: hidden;  // 元素隐藏,位置保留
 	height: 0;		  	// 解决IE6解析高度0不正确问题
 	overflow: hidden;  	 // 解决IE6解析高度0不正确问题
 }
 .clearfix {
     *zoom: 1;  /*ie6,7 专门清除浮动的样式*/
 }


 /*声明清除浮动的样式*/
 .clearfix:before ,.clearfix:after {
 	content: "";
 	display: table;
 }
 .clearfix:after {
     clear:both;
 }
 .clearfix {
    *zoom: 1;  /*ie6,7 专门清除浮动的样式*/
 }

猜你喜欢

转载自blog.csdn.net/CMDN123456/article/details/132606439