小編給大家分享一下為什么要清除浮動，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
clearfix清除浮動分為兩種：
清除自身浮動
清除父級浮動
一、為什么要清除浮動
一個塊級元素的高度如果沒有設置height，那么其高度就是由里面的子元素來撐開的，如果子元素使用浮動，脫離了標準的文檔流，那么父元素的高度會將其忽略，你可以使用firebug查看下如果不清除浮動，父元素會出現高度不夠，那樣如果設置border或者background都得不到正確的解析。
簡潔清除浮動
clearfix1:before,.clearfix1:after{ content: ""; display: table; }
.clearfix1:after{ clear: both; overflow: hidden; }
.clearfix1{ zoom: 1; }經典清除浮動：
.clearfix2:after { visibility: hidden; display: block; font-size: 0; content: " ";
clear: both; height: 0; } * html
.clearfix2 { zoom: 1; } /* IE6 */*:first-child+html .clearfix2 { zoom: 1; } /* IE7 */overflow清除浮動：
/* overflow:auto */#demo3{ overflow:auto;*zoom:1; }/*或 overflow:hidden */#demo4{ overflow:hidden;*zoom:1; }inline-block方式
#demo5{ display:inline-block;*display:inline;*zoom:1; }這個方法和上面的其它方法會有點差異，主要是inline-block造成的。
以上是為什么要清除浮動的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
