在網頁搭建過程中,浮動是布局中必不可少的。但是當子元素浮動後,其父級元素就會出現高度不夠的情況。這時候,我們需要去清除浮動。下面,我就總結了一些清除浮動的方法。
1、新增乙個空的div,給這個空的div設定css屬性即:clear:both
。這樣的方法瀏覽器相容比較好,而且比較簡單。但是這樣做頁面中就會出現很多空的div。
2、在包含浮動元素的父元素上增加類。然後在公共樣式的css檔案中給此類設定css屬性。即:.clearfloat:after
.clearfloat
這樣即清除了浮動。頁面中又不會出現空的div.寫在公共樣式檔案中的話,減少了**量。
3、給要浮動的元素的float:left或者float:right修改為display:inline-block.也可以解決浮動問題。
css清除浮動方法
html 浮動 不想被浮動影響 css wrap float nofloat 現在雖然加了乙個空的div,但是並沒有給它清除浮動,所以目前的效果就是第三個子元素.nofloat還是收到浮動的影響。ok,現在給.clear加上清除浮動 clear ps 這種情況比較適合元素之間是垂直排列布局的,為了不...
css 清除浮動方法
1 額外標籤法 隔牆法 style clear both div 2 父級 overflow hidden style overflow hidden div 3 父級 after 偽元素 clearfix after clearfix 4 父級雙偽元素 clearfix before,clearf...
CSS清除浮動的方法
給元素設定了float屬性後脫離了文件流,不佔據位置,所以其父級無法將其包裹,需要清除浮動。段 box item style class box class item div div 效果 方法一 給父級設定高度 段 box 問題解決 缺點 擴充套件性不好,沒有解決根本問題 方法二 給父級加上flo...