HTML中清除浮動的三種方法

2021-09-19 11:21:24 字數 367 閱讀 6572

當父元素不設定高度,且子元素浮動時,會發生高度塌陷,解決辦法如下:

1.給父元素新增overflow:hidden;

《注:如果父元素上有定位,且定位在父元素之外,此方法不適用》

2.最後乙個浮動元素的下方新增乙個空的div,並新增宣告:height:0;overflow:hidden;clear:both;

《注:造成**冗餘》

3.萬能清除浮動法:

父元素選擇符:after

《注:.clear:after此寫法要在需要清除浮動的父元素標籤的class屬性上新增空格加clear》

清除浮動的三種方法

lang en charset utf 8 清除浮動的三種方法title type text css div3 div3 after style head style background blue border 1px solid gold 使用空標籤清除浮動。增加了無意義的結構元素 style ...

清除浮動的三種方法

在我使用浮動時,為我們帶來了便利的同時也帶了一點影響,我們在使用浮動時往往不會給父級盒子新增高度,因為子盒子會撐起父盒子。這樣一旦我們使用浮動,則下面使用的div會跑到父級盒子的位置,畢竟使用浮動,不占有位置,解決此問題我列出了三種方法,希望能幫助大家。1 在浮動元素後新增空標籤 eg 111222...

清除浮動的三種方法

浮動布局,float left 會使當前元素脫離文件流,從而失去對父級元素的支撐,如果此時父級元素沒有設定高度,下面的元素就會擠上去,因此需要清除浮動 給浮動元素的父級元素設定overflow hidden 在浮動元素的同級下新增乙個空標籤,並且設定clear both 浮動元素的父級元素使用 af...