溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹css中clearfix實現清楚浮動的方法，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
css的clearfix實現清楚浮動的方法：首先在需要清除浮動的時候，只要寫一個【.clearfix】就行了；然后在需要清浮動的元素中添加clearfix類名就好了。
css的clearfix實現清楚浮動的方法：
clearfix的定義：
.clearfix:after {}{
content: "."; /**//*內容為“.”就是一個英文的句號而已。也可以不寫。*/
display: block; /**//*加入的這個元素轉換為塊級元素。*/
clear: both; /**//*清除左右兩邊浮動。*/
visibility: hidden; /**//*可見度設為隱藏。注意它和display:none;是有區別的。visibility:hidden;仍然占據空間，只是看不到而已；*/
line-height: 0; /**//*行高為0；*/
height: 0; /**//*高度為0；*/
font-size:0; /**//*字體大小為0；*/
}
.clearfix {}{ *zoom:1;} /**//*這是針對于IE6的，因為IE6不支持:after偽類，這個神奇的zoom:1讓IE6的元素可以清除浮動來包裹內部元素。*/clearfix的原理：
1、在IE6, 7下zoom: 1會觸發hasLayout，從而使元素閉合內部的浮動。
2、在標準瀏覽器下，.clearfix:after這個偽類會在應用到.clearfix的元素后面插入一個clear: both的塊級元素，從而達到清除浮動的作用。
3、在需要清除浮動的時候，只要寫一個.clearfix就行了，然后在需要清浮動的元素中 添加clearfix類名就好了。
以上是“css中clearfix實現清楚浮動的方法”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
