眾所周知，瀏覽器的相容性問題是開發人員經常會遇到的問題，它是由於不同瀏覽器的不同對**的解析不同，而產生的在頁面上顯示的效果不同。那麼，現在我把從工作當中發遇到的有關相容性問題及解決方案做個簡單總結，供各位參考：
第一類：塊狀元素float後，有新增了橫向的margin，在ie6下比設定的值要大（屬於雙倍浮動的bug）
解決方案：給float標籤新增display：inline，將其轉換為行內元素
第二類：表單元素行高不一致
解決方案：給表單元素新增float：left（左浮動）；或者是vertical-align：middle；（垂直對齊方式：居中）
第三類：設定較小高度的容器（小於10px），在ie6下不識別小於10px的高度；
解決方案：給容器新增overflow：hidden；
第四類：當在a標籤中巢狀img標籤時，在某些瀏覽器中img會有藍色邊框；
解決方案：給img新增border：0；或者是border：none；
第五類：min-height在ie6下不相容
解決方案：
1）min-height：value；
_height：value；
2）min-height：value；
height：auto！important；
height：value；
第六類：預設有間隙
解決方案：
1）給img標籤新增左浮動float：left；
2）給img標籤新增display：block；
第七類：按鈕預設大小不一
解決方案：
1）用a標籤來模擬按鈕，新增樣式；
2）如果按鈕是一張背景，那麼直接給按鈕新增背景圖；
第八類：百分比的bug
解決方案：父元素寬度為100%，子元素寬度各為50%，在ie6下各個元素寬度之和超過100%
解決方案：給右邊浮動的子元素新增clear：right；
第九類：滑鼠指標bug
描述：cursor：hand；只有ie瀏覽器識別，其他瀏覽器不識別
解決方案：cursor：pointer；ie6以上瀏覽器及其他核心瀏覽器都識別；
第十類：透明度屬性
解決方案：針對ie瀏覽器：filter：alpha（opacity=value）；（取值範圍1--100）
相容其他瀏覽器：opacity：value；（取值範圍0--1）
第十一類：上下margin的重疊問題
描述：給上邊元素設定了margin-bottom，給下邊元素設定了margin-top，瀏覽器只會識別較大值；
解決方案：margin-top和margin-bottom中選擇乙個，只設定其中乙個值；
關於hack
◆ie6認識的hacker 是下劃線_ 和星號 *
◆ie7 遨遊認識的hacker是星號 *
比如這樣乙個css設定：
height:300px;*height:200px;_height:100px;
ie6瀏覽器在讀到height:300px的時候會認為高時300px；繼續往下讀，他也認識*heihgt， 所以當ie6讀到*height:200px的時候會覆蓋掉前一條的相衝突設定，認為高度是200px。繼續往下讀，ie6還認識_height,所以他又會覆蓋掉200px高的設定，把高度設定為100px；
ie7和遨遊也是一樣的從高度300px的設定往下讀。當它們讀到*height200px的時候就停下了，因為它們不認識_height。所以它們會把高度解析為200px，剩下的瀏覽器只認識第乙個height:300px;所以他們會把高度解析為300px。因為優先順序相同且想衝突的屬性設定後乙個會覆蓋掉前乙個，所以書寫的次序是很重要的。
常見瀏覽器相容性問題
概念 不同的瀏覽器對同一段 解析不同造成瀏覽器顯示效果不同，我們把這樣的問題叫做瀏覽器相容性問題 描述 塊元素float後，又設定了橫向的margin值，在ie6下顯示的margin值比設定的值要大，並且是2倍關係 解決方案 給float的塊元素新增display inline 解決方案 a 給表單...
常見的瀏覽器相容性問題
1.就是ie6雙倍邊距的問題，在使用了float的情況下，不管是向左還是向右都會出現雙倍，最簡單的解決方法就是用display inline 加到 css裡面去。2.文字本身的大小不相容。同樣是font size 14px的宋體文字，在不同瀏覽器下佔的空間是不一樣的，ie下實際佔高16px，下留白3...
瀏覽器常見的相容性問題
1.瀏覽器相容問題一 不同瀏覽器的標籤預設的margin和padding不同。解決辦法 2.瀏覽器相容問題二 ie6雙邊距 bug，塊屬性標籤 float 後，又有橫行的 margin 情況下，在 ie6顯示 margin 比設定的大。3.瀏覽器相容問題三 設定較小高度標籤 一般小於 10px 在i...