所謂的標準流就是，行內(nèi)元素自己單獨一行，而塊級元素是上下顯示的。以前我們學(xué)習(xí)的都是標準流。注意：標準流使我們網(wǎng)頁布局中最穩(wěn)定的一種結(jié)構(gòu)
使我們學(xué)習(xí)的脫離標準流的第一種方式。會影響我們標準流的排列。所以，我們布局的時候，能用標準流做的，就不用浮動做。
定位流也是脫離標準流的一種模式。它完全脫離標準流，不會對標準流有影響。
我們要浮動的目的： 我們浮動的目的，就是可以把多個塊級元素放到想要的一行上。浮動 Float：leftrightnone你不得不必須知道詳細的理解浮動：1.浮動已經(jīng)脫離的標準流。（脫標）也就是說，浮動已經(jīng)漂浮在標準流的上方。2.因為我們的浮動是左右浮動，所以我們的塊級元素都是左右排列。
如果想要我們做的網(wǎng)頁瀏覽器兼容性好，首先要保證的是，我們寫的代碼要足夠標準。清除浮動的原因：因為浮動會影響標準流。所以我要根據(jù)不同情況來清除浮動。Clear:both;
W3c推薦，再最后一個浮動的盒子的后面，新添加一個標簽。然后他可以清除浮動。
優(yōu)點：通俗好理解缺點：增加了太多的標簽
使用方法：是浮動的大盒子（父級標簽）再樣式里面加:overflow:hidden;為了照顧ie6，我們再加上zoom:1;
優(yōu)點：代碼書寫方便缺點：如果這個父盒子，里面還有定位，就會引起麻煩。
.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>
優(yōu)點：一次寫完，后面直接調(diào)用就可以了缺點：聲明麻煩寫
.clearfix:before,.clearfix:after{content:"";display:table;}.clearfix:after{clear:both;}.clearfix{/*照顧ie6*/zoom:1;}使用：<divclass="boxclearfix">
第四種，是大部分大型網(wǎng)站常用的，比如新浪淘寶的清除浮動的效果。
以上希望對大家有所幫助。
小強零零壹和大家一起分享。
新聞熱點
疑難解答
