新聞中心
本篇文章和大家了解一下css清除浮動的代碼演示。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有所幫助。
創(chuàng)新互聯(lián)公司從2013年成立,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項目網(wǎng)站設(shè)計制作、成都做網(wǎng)站網(wǎng)站策劃,項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命,1280元長沙做網(wǎng)站,已為上家服務(wù),為長沙各地企業(yè)和個人服務(wù),聯(lián)系電話:18982081108
首先我們要知道clear:both是清除浮動的關(guān)鍵。
clear是CSS中的定位屬性,規(guī)定元素的哪一側(cè)不允許其他浮動元素。那么clear:both就是規(guī)定在左右兩側(cè)均不允許浮動元素。
clear屬性只能在塊級元素上其作用,這就是清除浮動樣式中display:block的作用。
另外visibility: hidden;height: 0;只要content的值為空,寫不寫都無所謂。
那么為什么要清除浮動,最常見的是因為外層容器高度坍塌,代碼演示:
為了顯示清楚一點,在.wrap:after 樣式中的content設(shè)置為content: 'after偽元素' ,此時如下圖所示。
隨后在.wrap:after 樣式中加上clear:both,表明after偽元素左右兩側(cè)均不允許浮動元素,沒辦法只好把after偽元素放在下面,此時如下圖所示。
順帶撐起了.wrap父元素的高度,這樣就相當清除了浮動了,解決了外層容器高度坍塌的問題。
那么我們把.wrap:after 樣式中的content設(shè)置為content:' ',最后就如下圖所示。
以上就是css清除浮動的代碼演示的簡略介紹,當然詳細使用上面的不同還得要大家自己使用過才領(lǐng)會。如果想了解更多,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道哦!
當前文章:css清除浮動的代碼演示
文章分享:http://fisionsoft.com.cn/article/pgceep.html