IE6常見CSS解析Bug及hack

2021-08-09 14:47:04 字數 1096 閱讀 6789

a)div中的間隙(該bug出現在ie6及更低版本中)

描述:在div中插入時,會將div下方撐大三畫素。

hack1:將

與hack2:將

b)dt,li中間隙(ie6)

hack:將

img設定對齊方式屬性vertical-align:top;

描述:當ie6及更低版本瀏覽器在解析浮動元素時,會錯誤地把浮向邊邊界加倍顯示。

hack:給浮動元素新增宣告:_display:inline; 

描述:在ie6及以下版本中,部分塊元素擁有預設高度(低於16px高度)

hack1:給元素新增宣告:font-size:0;

hack2:給元素新增宣告:overflow:hidden;

描述:表單元素行高對齊方式不一致

hack:給表單元素新增宣告:float:left;或vertical-align:top;

去掉表單控制項的邊框時用border:0; border:none;不能相容ie7以下瀏覽器。

描述:在ie6及以下版本中在解析百分比時,會按四捨五入方式計算從而導致50%加50%大於100%的情況。

hack:給右面的浮動元素新增宣告:clear:right;     意思:清除右浮動。     

clear:left:清除左浮動

clear:both:清除兩邊的浮動

bug1:在給的子元素中使用了float:left;父元素中沒有設定浮動屬性,li階梯狀效果。

hack:給父元素設定浮動便能解決此問題

bug2:當給li裡的a轉成塊元素,並設定了固定高度時,且給父元素寫了浮動後在ie6及更低的版本瀏覽器裡會出現垂直顯示。

hack:給a也設定左浮動便可解決。

描述:cursor屬性的hand屬性值只有ie瀏覽器識別,其它瀏覽器不識別該宣告,cursor屬性的pointer屬性值ie6.0以上版本及其它核心瀏覽器都識別該宣告。

hack:如統一某元素滑鼠指標形狀為手型,應新增宣告:cursor:pointer;

1.opacity:0~1;ie8以上的瀏覽器

2.filter:alpha(opacity=1~100);     ie9及ie9以下的瀏覽器

IE6常見CSS解釋BUG及hack

1 有邊框bug hack 給新增border 0或border 0 none。2 有間隙 hack1 將div與img併排寫在一行。hack2 將img轉為塊狀元素,即新增宣告display block。3 dt,li中有間隙 hack 將img轉為塊狀元素,新增宣告display block。4...

IE6常見BUG 和處理

1 ie6怪異解析之padding與border算入寬高 原因 未加文件宣告造成非盒模型解析 解決方法 加入文件宣告 2 ie6在塊元素 左右浮動 設定marin時造成margin雙倍 雙邊距 解決方法 display inline 3 以下三種其實是同一種bug,其實也不算是個bug,舉個例子 父...

ie6 常見bug解決之道

bug 1 解決div 無法遮擋 select 的問題 一現象 在調整頁面樣式時,經常發現浮動層的div被select遮擋。效果如下 二.原因 在ie中,select屬於window型別控制項,它會 擋住 所有非window型別控制項 可以這麼理解,div這樣的元件是在瀏覽器客戶區使用 渲染 的,他...