所谓的标准流就是，行内元素自己单独一行，而块级元素是上下显示的。以前我们学习的都是标准流。注意：标准流使我们网页布局中最稳定的一种结构
使我们学习的脱离标准流的第一种方式。会影响我们标准流的排列。所以，我们布局的时候，能用标准流做的，就不用浮动做。
定位流也是脱离标准流的一种模式。它完全脱离标准流，不会对标准流有影响。
我们要浮动的目的： 我们浮动的目的，就是可以把多个块级元素放到想要的一行上。浮动 Float：leftrightnone你不得不必须知道详细的理解浮动：1.浮动已经脱离的标准流。（脱标）也就是说，浮动已经漂浮在标准流的上方。2.因为我们的浮动是左右浮动，所以我们的块级元素都是左右排列。
如果想要我们做的网页浏览器兼容性好，首先要保证的是，我们写的代码要足够标准。清除浮动的原因：因为浮动会影响标准流。所以我要根据不同情况来清除浮动。Clear:both;
W3c推荐，再最后一个浮动的盒子的后面，新添加一个标签。然后他可以清除浮动。
优点：通俗好理解缺点：增加了太多的标签
使用方法：是浮动的大盒子（父级标签）再样式里面加:overflow:hidden;为了照顾ie6，我们再加上zoom:1;
优点：代码书写方便缺点：如果这个父盒子，里面还有定位，就会引起麻烦。
.clearfix:after{content:"";display:block;visibility:hidden;clear:both;height:0;}.clearfix{/*为了照顾ie6浏览器*/zoom:1;}
<divclass="boxclearfix">
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>overflow清除浮动</title><styletype="text/css">.clearfix:after{content:"";display:block;visibility:hidden;clear:both;height:0;}.clearfix{/*为了照顾ie6浏览器*/zoom:1;}.box{width:400px;}.one,.two{width:200px;height:100px;background-color:#093;float:left;}.two{background-color:#39F;}.test{width:400px;height:120px;background-color:#900;}</style></head><body><divclass="boxclearfix"><divclass="one"></div><divclass="two"></div></div><divclass="test"></div></body></html>
优点：一次写完，后面直接调用就可以了缺点：声明麻烦写
.clearfix:before,.clearfix:after{content:"";display:table;}.clearfix:after{clear:both;}.clearfix{/*照顾ie6*/zoom:1;}使用：<divclass="boxclearfix">
第四种，是大部分大型网站常用的，比如新浪淘宝的清除浮动的效果。
以上希望对大家有所帮助。
小强零零壹和大家一起分享。
新闻热点
疑难解答
