欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

淺談CSS中overflow清除浮動的用法

一起CSS   發(fā)布時間：2015-09-28 11:19:29   作者：佚名   我要評論
這篇文章主要介紹了CSS中overflow清除浮動的用法,讓對IE6的支持再進行最后一點續(xù)命...需要的朋友可以參考下

overflow清除浮動以下面的XHTML代碼為例：

XML/HTML Code復制內(nèi)容到剪貼板
  1. <div id="container">  
  2. <div id="left"></div>  
  3. <div id="right"></div>  
  4. </div>  


我以前用的方法是（CSS代碼）：

CSS Code復制內(nèi)容到剪貼板
  1. #container{   
  2. width:1000px;   
  3. overflow:hidden;   
  4. background:#999999;   
  5. }   
  6. #left{   
  7. width:70%;   
  8. height:500px;   
  9. float:left;   
  10. background:#ff0000;   
  11. }   
  12. #right{   
  13. width:28%;   
  14. height:500px;   
  15. float:rightright:   
  16. background:#0000ff;   
  17. }  

這種方法有效的清除了浮動，但 IE6 里沒有效果，所以為了兼容 IE6 ，需要為父元素設了一個寬度，并且是一個合適的寬度。

再一種方法是把 overflow:hidden 換成 overflow:auto ，但 IE6 仍然沒有效果，為了兼容 IE6 ，還是要做“手腳”，可以為父元素加上 height:1% 或 zoom:1 ，有人說 height:1% 應該寫成 _height:1% ，但我并沒有發(fā)現(xiàn)不加_符號有什么影響。而 zoom:1 則不能通過W3C驗證。

總結一下：清除浮動可以用 overflow:hidden 或 overflow:auto ，在比較標準的瀏覽器里沒有問題，但 IE6 沒有效果，為了兼容 IE6 ，可以為父元素：

1、設置一個合適的寬度，但“合適的寬度”有的時候不好掌握；

2、加上 height:1% ，什么都不用管，加上就有效，我還沒有發(fā)現(xiàn)缺點；

3、加上 zoom:1 ，不能通過W3C驗證。

為了兼容 IE6 的這三種方法根據(jù)自己的實際情況和個人喜好選擇吧。

相關文章

  • CSS3 清除浮動的方法示例

    這篇文章主要介紹了CSS3 清除浮動的方法示例的相關資料,通過本文，讓大家可以明白清除浮動的原理和幾種方法，最后得出一種本文認為最好用的方法,感興趣的小伙伴們可以參考
    2018-06-01

  • CSS清除浮動float的三種方法小結

    使元素脫離文檔流，按照指定方向發(fā)生移動，遇到父級邊界或者相鄰的浮動元素停了下來。本文給大家?guī)砹薈SS清除浮動float的三種方法小結，感興趣的朋友跟隨腳本之家小編一起
    2018-03-13

  • 清除css浮動的三種方法小結

    這篇文章主要介紹了清除css浮動的三種方法小結,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2018-01-19

  • 詳解css清除浮動float的七種常用方法總結和兼容性處理

    這篇文章主要介紹了詳解css清除浮動float的七種常用方法總結和兼容性處理,非常具有實用價值，需要的朋友可以參考下
    2017-09-11

  • CSS清除浮動方法小結

    本文主要介紹了CSS解決浮動，清除浮動的幾種方法：1、設置父元素高度；2、overflow；3、增加子元素（塊級），并且設置其clear屬性值為both來解決（隔墻法、內(nèi)墻法）；4、使
    2017-03-22

  • CSS清除浮動的常用方法優(yōu)缺點分析

    這篇文章主要為大家詳細介紹了CSS清除浮動的常用方法優(yōu)缺點，分析很全面，感興趣的小伙伴們可以參考一下
    2016-04-25

  • html+css 清除浮動的相關技巧心得

    下面小編就為大家?guī)硪黄猦tml+css 清除浮動的相關技巧心得。小編覺得挺不錯的，現(xiàn)在分享給大家，給大家一個參考
    2016-03-17

  • CSS中使用clearfix清除浮動的方法

    這篇文章主要介紹了CSS中使用clearfix清除浮動的方法,作者列出了幾個clearfix的不同的使用方法進行對比,需要的朋友可以參考下
    2015-07-09

  • css 盒模型 文檔流 幾種清除浮動的方法實例詳解

    這篇文章主要介紹了css 盒模型 文檔流 幾種清除浮動的方法實例詳解,需要的朋友可以參考下
    2018-09-10

最新評論