清除浮动

人生苦短，有始有终。 好比我们的浮动，有浮动开始，则就应该有浮动结束。
一.为什么要清除浮动
由于浮动元素不再占用原文档流的位置，所以它会对后面的元素排版产生影响，为了解决这些问题，此时就需要在该元素中清除浮动。
本来做一些文字混排效果，但是现在用于做布局，所以会出现很多问题。
准确的说，不是清除浮动，而是清除浮动后造成的印象
清除浮动本质：
主要是为了解决父级元素因为子级浮动引起内部高度为0的问题
二.清除浮动的方法
闭合浮动，记住，清除浮动就是把浮动的盒子圈在里面，让父盒子闭合出入口，不让他们影响其他元素
在CSS中，clear属性用于清除浮动，其基本语法格式如下：
选择器{clear:属性值;}
left     不允许左侧有浮动元素（清除左侧浮动的影响）
right     不允许右侧有浮动元素（清除右侧浮动的影响）
both     同时清除左右两侧浮动的影响
1.额外标签法
w3c推荐的做法，在浮动元素的末尾添加新标签（清除浮动的样式）

优点:通俗移动，书写方便
缺点：添加了很多无意义的标签，结构化较差。 (推荐的方法不接受)
2.父级添加overflow属性方法
触发BFC的方式，可以实现清除浮动的效果。

优点：代码简介
缺点：内容增多时不会自动换行，无法显示需要溢出的元素
3.使用after伪元素清除浮动
：after是空元素的升级版

优点:符合闭合浮动，结构语义化正确(网易页面大多使用可以去查看)
缺点:ie6,7不支持:after,所以使用zoom清除浮动
4.使用before和after双伪元素清除浮动
清除浮动：加上clear:both,使元素下移，直到两边没有浮动元素
闭合浮动：使浮动元素闭合，使父元素高度不在塌陷，这样减少了浮动带来的影响

优点：代码更加简介
缺点:ie6,7不支持:after,所以使用zoom清除浮动