相容性問題總結

2021-09-01 11:19:20 字數 3204 閱讀 3790

1、

解決方案：

img
2、在ie7下的inline-block沒用。

解決方案：

display:inline-block;


*display:block;
3、標籤之間有空格。

解決方案：

①浮動。

②如果標籤少的話就變成一行。如：

<


a>插入


a><


a>**


a>
4、z-index的問題，主要是在於設定父級的z-index。且position必須為absolute、relative、fixed。

5、裡面的文字，在ie8以下需要設定成text-align：center。

6、對於行內元素雙擊變藍的問題。

解決方案：

<


div 


class


="leftchick"


>


<


div 


class


="bg"


>


div>


<


span 


class 


="lc"


onselectstart="return false"


>


span


>


div>


<


div 


class


="rightchick"


>


<


div 


class


="bg"


>


div>


<


span 


class


="rc lc"


onselectstart


="return false"


>


span


>


div>
在ie7下面的overflow：hidden；沒效果，設定之後還是顯示。

html**：

<


div 


class


="case_list"


>


<


div 


class


="cell"


>


<


ul>


<


li><


img 


src="image/home_page/index7_24.png"


>


li>


<


li><


img 


src="image/home_page/index7_26.png"


>


li>


<


li><


img 


src="image/home_page/index7_28.png"


>


li>


<


li><


img 


src="image/home_page/index7_30.png"


>


li>


<


li><


img 


src="image/home_page/case_03.png"


>


li>


<


li><


img 


src="image/home_page/case_06.png"


>


li>


<


li><


img 


src="image/home_page/case_08.png"


>


li>


<


li><


img 


src="image/home_page/case_11.png"


>


li>


<


li><


img 


src="image/home_page/case_17.png"


>


li>


<


li><


img 


src="image/home_page/case_18.png"


>


li>


<


li><


img 


src="image/home_page/case_19.png"


>


li>


<


li><


img 


src="image/home_page/case_20.png"


>


li>


<


li><


img 


src="image/home_page/case_25.png"


>


li>


<


li><


img 


src="image/home_page/case_26.png"


>


li>


<


li><


img 


src="image/home_page/case_27.png"


>


li>


<


div 


class


="clear"


>


div>


ul>


div>
css部分：

#casewrap .case_list#casewrap .cell#casewrap .case_list ul#casewrap .case_list li
解決方案：在".cell"中加入position：relative;

解決方法

使用w3c的標準相容模式。ie6或者之後的版本能基於w3c的標準計算，但是你仍舊會在ie5中遇到問題。

或者你可以用css hack來解決這個問題。所有標準相容的瀏覽器都能讀取w\\idth:180px 除了ie5。

8、overflow-y:auto時在ie7下出現下面的情況時：

通過給overflow:auto || scroll的元素新增position:relative；即可解決問題，記住：只要寫了overflow：auto||scroll，都寫上position:relative。

相容性問題總結

以便面試被問到的時候什麼都說不出來 不過現在已經不是之前需要關注ie6那些怪異相容性問題的時代了，ie最多支援到8。除了ie8的相容性問題外，還有一些移動端的相容問題。面試中被問到的話，最好結合自己實際的經驗說一下，什麼情況下遇到的，怎麼處理的，而不是背書。當初ie8發布時，相對於ie6 7已經做出...

相容性問題總結

1 transform 要加ms字首，上次紅公尺note2 不居中問題 最好 ms webkit ms o 都加上 2 火狐 button裡面罩著a a會失效，a裡面加button，a給鏈結，不會失效，解決。3 ie瀏覽器的input text會自動加x用於刪除，密碼自動加眼睛。清除ie自帶x和眼睛...

相容性問題總結

1 event相容性寫法 var ev ev window.event 2 clientwidth 相容寫法 document.documentelement.clientwidth document.body.clientwidth 3 ev.target var target ev.srcele...