清除浮動造成的影響的解決方案總結


1、將設置float的元素的父元素也設置float。

  缺點:很有可能不符合情況要求

2、設置父元素的position為absolute,前提是父元素的父元素並沒有設置position:relative。

  缺點:很有可能不符合情況要求

3、設置父元素的overflow為hidden。

  尚不知曉,猜測是只能清除浮動帶來的父元素塌陷,但無法閉合浮動(待驗證)

4、設置父元素的display為inline-block。

  缺點:可能不符合情況要求。

5、設置父元素的zoom為1。

  缺點:zoom為IE私有屬性

6、浮動元素的下方加入額外的元素<br style="clear:both;" />

  缺點:增加額外的標簽使HTML結構看起來不夠簡潔

7、使用after偽類(此方法目前應用較廣)

some:after{

  content:".";

  height:0;

  visibility:hidden;

  display:block;

  clear:both;

}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM