父類清除浮動的緣由、(清除浮動代碼,置於CSS中方便調用)

浮動因素在靜態網頁製做中常常被應用到,好比要讓塊級元素不獨佔一行,經常應用設置float的方式來實現。可是應用的時候會發現,設置了子類浮動後,未給父類清除浮動,這樣就會形成一下問題:文檔

        1.浮動的元素會相對於父容器或者是前面已經定位的元素進行浮動,浮動的元素脫離文檔流,也就是再也不佔有原有的位置,會影響後面的元素或者是父容器it

        2.父容器正常狀況下會自動擴高,可是子元素加了浮動後位置不保留,父容器就感受它不存在了,因此不會擴高。容器

因此,在編寫靜態網頁時,必定要注意浮動的清除問題,一段清除浮動代碼能夠方便調用:float

         .clearFloat:after{di

                content:' ';清除浮動

                display:block;vi

                height:0;co

                visibility:hidden;display

}block

          .clearFloat{

                zoom:1;

}

相關文章
相關標籤/搜索