IE6瀏覽器的bug問題及相關解決的方法

1、css浮動邊距加倍錯誤（雙倍邊距BUG）的解決辦法???該錯誤只影響ie而不影響其他瀏覽器，我們可以考慮用hack來解決！！！?? 解決方法：_display:inline;?

2、擴展框問題??原因：無法將內容放入固定寬度或固定高度的框中，則框會擴展以適應內容，而不是讓內容溢出框外。解決方法：overflow: hidden

3、png圖片的問題，?? IE6一下版本不支持png圖片的格式；

4、三像素文本慢移? ?Ie6里面的banner部分折成三行，? 解決方法：在IE6中讓最后一個盒子減少三個像素，這就需要用到!important這個關鍵字了（讓其它盒子也可以，那個方便就設那個）或者：zoom：1；

5.在IE6里，浮動元素的子元素如果定義了高度，則其子元素的寬度是其上一個不浮動的祖先元素的100%，

解決方法：一是不給其子元素設固定高度（只設行高），二是也讓這個子元素變成浮動元素。

7、一個空格引發CSS失效?這段代碼對<p>的首字符樣式定義在IE6上看是沒有效果的（IE7沒測試），而在p:first-letter和{font-size:300%}加上空格，也就是p:first-letter {font-size:300%}后，顯示就正常了。但是同樣的代碼，在FireFox下看是正常的。按道理說，p:first-letter{font-size:300%}的寫法是沒錯的。那么問題出在哪里呢？答案是偽類中的連字符"-"。IE有個BUG，在處理偽類時，如果偽類的名稱中帶有連字符"-"，偽類名稱后面就得跟一個空格，不然樣式的定義就無效。而在FF中，加不加空格都可以正常處理。

8、超鏈接訪問過后hover樣式就不出現的問題?? 被點擊訪問過的超鏈接樣式不在具有hover和active了,很多人應該都遇到過這個問題，解決方法是改變CSS屬性的排列順序: L-V-H-A a:link {color: #1f3a87; text-decoration:none;} a:visited{color: #83006f;text-decoration:none;} a:hover {color: #bc2931;text-decoration:underline;} a:active {color: #bc2931;}

9、IE6的雙倍邊距BUG? 浮動后本來外邊距10px,但IE解釋為20px,

解決辦法是加上display:inline

10、IE6下這兩個層中間怎么有間隙?這個IE的3PX BUG也是經常出現的，解決的辦法是給.right也同樣浮動 float:left 或者相對IE6定義.left margin-right:-3px;

12、IE6中奇數寬高的BUG? IE6還有奇數寬高的bug，解決方案就是將外部相對定位的div寬度改成偶數。

13、IE6下為什么圖片下方有空隙產生?解決這個BUG的方法也有很多，可以是改變html的排版，或者定義img 為display:block 或者定義vertical-align屬性值為vertical-align:top | bottom |middle |text-bottom 還可以設置父容器的字體大小為零，font-size:0

14、IE6下DIV高度顯示的Bug ??IE6下默認的字體尺寸大致在12 - 14px 之間，當你試圖定義一個高度小于這個默認值的 div 的時候， IE 會固執的認為這個層的高度不應該小于字體的行高。所以即使你用 height: 6px; 來定義了一個 div 的高度，實際在 IE 下顯示的仍然是一個 12 px 左右高度的層。??

要解決這個問題，可以強制定義該 div 的字體尺寸，或者定義 overflow 屬性來限制 div 高度的自動調整。比如 <div style="height: 6px; font: 0pxArial;"></div> 或者 <div style="height: 6px; overflow:hidden;"></div> 都可以阻止 IE 的自作聰明。?

??該問題在 IE7 / Firefox /Opera 下均不存在。

本面試題為前端常考面試題，后續有機會繼續完善。我是歌謠，一個沉迷于故事的講述者。

歡迎一起私信交流。

“睡服“面試官系列之各系列目錄匯總（建議學習收藏）?

總結

以上是生活随笔為你收集整理的“约见”面试官系列之常见面试题之第四十九篇之ie6bug的解决办法（建议收藏）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。