前端小白奋斗史06(清除浮动的方法）

清除浮动

1. 额外标签法也称为隔墙法，是 W3C 推荐的做法

选择器{clear:属性值;}

我们实际工作中， 几乎只用 clear: both;

清除浮动的策略是: 闭合浮动.

2. 父级添加 overflow 属性

可以给父级添加 overflow 属性，将其属性值设置为 hidden、 auto 或 scroll 。

overflow：hidd

3. 父级添加after伪元素

.clearfix:after { 
 content: ""; 
 display: block; 
 height: 0; 
 clear: both; 
 visibility: hidden; 
} 
.clearfix { /* IE6、7 专有 */ 
 *zoom: 1;
}

4 父级添加双伪元素

.clearfix:before,.clearfix:after {
 content:"";
 display:table; 
}
.clearfix:after {
 clear:both; }.clearfix {
 *zoom:1;
}

为什么需要清除浮动？ ① 父级没高度。 ② 子盒子浮动了。 ③ 影响下面布局了，我们就应该清除浮动了。