[css] 寫出你遇到過IE6/7/8/9的BUG及解決方法
把以前兼容IE6.7學習的東西搬出來了，還以為不見了，
兼容性問題
1.IE6margin雙邊距問題
2.IE67 li間隙問題
3.圖片間隙問題——vertical-align：top
4.ie6下高度小于19px處理成19px；font-size:0;或者overflow：hidden
5.ie8以下濾鏡問題，filter:alpha(opacity=50)
6.IE6 position:fixed 不兼容，fixed定位ie6兼容，js處理，通過獲取滾動高度，賦值給需要固定的元素，設定絕對定位，設定top
7.ie6下父級的overflow：hidden是保不住子級的相對定位的（relative）-解決，給父級加定位
8.ie6下，絕對定位的父級，寬高是奇數的話，定位偏移會出現1px的偏差
9.ie6下，內容會撐開設定好的寬度
10.ie6，7 3px問題
11.<p><h3></h3></p>會把p元素分割成兩個，原因，嵌套的規范性，p需要嵌套inline元素
12.在ie6下，1px dotted #000 不兼容，精度問題，可以用背景平鋪
13.ie6下margin傳遞需要觸發haslayout，父級有邊框時，子元素margin值消失，解決辦法，觸發父級haslayout
14.ie6下當一行子元素占有的寬度之和與父級的寬度相差超過3px或者有不滿行狀態的時候，最后一行子元素的下margin就會失效
15.ie6下的文字溢位bug 條件1，子元素的寬度和父級的寬度相差小于3px的時候，2，兩個浮動元素中間有注釋或行內元素——解決辦法：用div吧注釋或行內元素包裹起來
16.ie6下，當浮動元素和絕對定位元素是并列關系的時候，絕對定位會消失，解決辦法：給定位元素外面包裹div
17.ie6，7下，輸入型別的表單控制元件上下各有1px的間隙——解決辦法：給input加浮動
18.ie6，7下，輸入型別的表單控制元件加border：none無效，還是會出現邊框——解決辦法：1，給border：0；2，重置input的背景
19.ie6，7下，輸入型別的表單控制元件輸入文字的時候，背景圖片會跟隨移動——解決辦法：把背景加給父級
20.處理ie6 png圖片兼容問題js插件，DD_belatedPNG.js,也可以用CSS濾鏡處理
a.css處理
b.微軟behavior擴展，下載iepngfix.htc
c.js插件
21.css hack \9——IE10之前的瀏覽器決議，+，*——IE7包括IE7之前的瀏覽器決議， _ ——IE6包括IE6之前的IE瀏覽器
22.important兼容問題，在IE6下，在important后面加一條同樣的樣式，會破壞important優先級作用，按照默認的優先級順序來走
23.IE6 margin負值不兼容，處理，只要position：relative；這個解決方案在圣杯布局中有出現，圣杯布局，可以用position：absolute；來定位
個人簡介
我是歌謠，歡迎和大家一起交流前后端知識，放棄很容易，
但堅持一定很酷，歡迎大家一起討論
主目錄
與歌謠一起通關前端面試題
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/262059.html
標籤：其他
上一篇：CSS星星打分特效