css清除浮动

清除浮动

1、为什么要清除浮动

由于父盒子很多情况下，不方便给高度，浮动的元素又不占有位置，最后父级盒子高度为0时，就会影响下面的标准流盒子

2、清除浮动的本质
1、 清除浮动的本质是清除浮动元素造成的影响；
2、 如果父盒子本身有高度，则不需要清除浮动；
3、 清除浮动后，父级会根据浮动的子盒子自动检测高度，父级有了高度，就不会影响下面的标准流了

3、语法

选择器{clear:属性值}
1、 left 不允许左侧有浮动元素（清除左侧浮动的影响）
2、 right 不允许右侧有浮动元素（清除右侧浮动的影响）
3、 both 同时清除左右两侧浮动的影响
4、 我们在实际工作中，几乎只用clear: both;
5、 清除浮动的策略是：闭合浮动

4、清除浮动的方法

1、额外标签法，是w3c推荐的做法。
在最后一个浮动盒子后面添加新标签，写上清除浮动
2、父级添加overflow 属性
可以给父级添加overflow属性，将其属性值设置为hidden\auto\或scroll.优点是代码简洁，缺点是无法显示溢出的部分
3、父级添加alter属性
4、父级添加双伪元素