浮动的影响与清除浮动

影响1：
div1 div2 div3,要实现dev1 div2 在第一排显示，div3另起一行？
方法：给div1 div2加浮动，1和2会脱离正常流，因为div3属于正常流会上到第一排，并且被1和2覆盖
就是为什么要清除浮动，消除浮动影响：
方法1：
加一个空div，.clearfix{clear:both} 在div3前加一个空div，加类clearfix，div3不会到第一排

影响2（高度塌陷）：
父不设高度，div1 div2，父div我只是给了它的背景颜色是黄色，这种情况很容易理解嘛，因为它的子元素把它撑开了嘛，那现在我的需求变了，将1和2一排展示，加浮动，此时父不能被撑开高度。
现在div1和div2都有了向左浮动，脱离了标准流，我们发现，原本外面包裹的div不见了，不理解的人这时候就很纳闷了，可能你在用的时候不会注意到，也有可能当时需求不一样，所以不能注意到这点，它是怎么回事呢，因为div1和div2都脱离了标准流，所以外面包裹的div没有支撑的东西， 也就是所谓的高度塌陷，那么，我们并不想让它呈现出这种效果，所以这个时候就要清楚浮动了
方法2：
overflow方法，在父元素上设置overflow这个属性，如果父元素的这个属性设置为auto或者是hidden，父元素就会扩展包含浮动，这个方法有着比较好的语义性，因为它不需要额外的元素，但是，要记住一点，overflow属性不是为了清除浮动而定义的，要小心不要覆盖住内容或者触发了不需要的滚动条。
现在我就给外面的div添加overflow：hidden，或者是auto，

 

方法3：
就是利用伪类元素来清除有浮动的标签，也就定义一个公共的类clearfix，给这个类添加css属性，在里面进行清除浮动的操作，光说没用，直接看代码吧：
.clearfix:after{
content:"";
display:table;
height:0;
visibility:both;
clear:both;
}
.clearfix{
*zoom:1; /* IE/7/6*/
}
比如上面的例子，我就给外面包着的div添加clearfix这个类，可以达到和上面同样的效果。这种方式这样理解，就是利用伪类元素，也就是在有浮动的标签前面添加一个块级元素，来达到效果。

方法4：
内部标签法和外部标签法