浮動的清除

浮動的性質: 脫標 貼邊 字圍 收縮

1. 給浮動的元素的祖先元素加高度（不常用）

   如果一個元素要浮動，那么它的祖先元素一定要有高度。高度的盒子，才能關住浮動。

2. clear:both
   cleat就是清除，both指的是左右浮動都要清除。
   缺點：margin失效

3. 隔墻法
   在兩個浮動的元素中間，建一個墻。隔開兩部分浮動，讓后面的浮動元素，不去追其那面的浮動元素。

       <div>
           <p></p>
           <p></p>
       </div>
       <div class="cl h10"></div>
       <div>
           <p></p>
           <p></p>
       </div>
   

缺點:第一個div還是沒有高度

4. 內墻法

       <div>
           <p></p>
           <p></p>
           <div class="cl h10"></div>
       </div>
       <div>
           <p></p>
           <p></p>
       </div>
   

   優(yōu)點: 不僅能夠使后部分的p不去追前面的p,并且能讓第一個div撐出高度.

5. overflow:hidden
   一個父親,不能被自己的浮動的兒子撐出高度.但是,如果給這個父親加上了overflow:hidden;那么這個父親就能夠被浮動的兒子撐出高度.這個現(xiàn)象,不能解釋.就是瀏覽器的小偏方.
   并且它能夠讓margin 生效.

瀏覽器兼容問題

1. IE6不支持小于12px的盒子,任何小于12px的盒子,在IE6中看都大.
   解決辦法: 將盒子的字號,設置小(小于盒子的高).比如0px;

height:4px;
_font-size:0px;

IE6專有屬性: 只要給css屬性之前,加上下劃線.

2. IE6 不支持用overflow:hidden 來清除浮動
   解決辦法: 以毒攻毒,追加一條 _zoom:1 ;
   完整寫法:

  overflow:hidden;
  _zoom:1;

_zoom:1; 能夠觸發(fā)IE6瀏覽器的hasLayout機制