作爲瀏覽器市場的老大，IE6的罪惡罄竹難書，不支持透明PNG這一“特性”讓IE6成爲常用瀏覽器中唯一的異類。IE特有的CSS濾鏡雖然可以做到這一點，但是代碼比較複雜，而且使用了該濾鏡所屬標籤下的鏈接失效。在這裏和大家分享一個能讓IE6不完美 支持透明PNG圖片的“傻瓜式”腳本，至於爲什麼是不完美，我們稍後分析
來源：
http://www.twinhelix.com/css/iepngfix/
預覽：
http://www.twinhelix.com/css/iepngfix/demo/
下載：
http://www.twinhelix.com/css/iepngfix/iepngfix.zip
效果：
允許IE6正常顯示使用<img>標籤插入或以CSS background-image方式寫入的透明PNG圖象。
使用方法：
1、下載腳本腳本，將其中的iepngfix.htc 和blank.gif解壓縮到合適的目錄內，.htc即Html Components ，該文件需要在CSS中被調用；blank.gif是一個1×1像素的透明GIF圖片，缺少該文件會使<img>標籤插入的PNG圖象顯示爲紅色的叉燒包。
2、在iepngfix.htc 中修改blank.gif 的路徑，var blankImg =‘blank.gif的正確路徑’，這是惟一一個需要修改的配置。
if (typeof blankImg == ‘undefined’) var blankImg = ‘blank.gif’;
3、在css中將需要使用透明PNG的元素與.htc文件關聯。
例如：*{behavior: url(iepngfix.htc) }
輕鬆三步，IE6就能支持透明PNG圖片了。
進階使用：
1、在css中使用通配符“*”調用.htc腳本會對body內所有標籤進行處理，加大客戶端的資源消耗，延緩頁面載入時間。我們可以細化CSS選擇器針對某一個標籤甚至是某個ID的元素來套用腳本以獲得更好的用戶體驗。
例如：img,div{behavior: url(iepngfix.htc) }
div#header{behavior: url(iepngfix.htc)}
如果無法預見頁面中哪些地方需要這個濾鏡，還可以將behavior寫入成class以便調用。
.pngsupport{behavior: url(iepngfix.htc)}
2、利用IE的條件註釋使腳本只應用於IE6及以下版本，減少對IE7用戶的影響。
<!–[if lte IE 6]>
*{behavior: url(iepngfix.htc)}
<![endif]–>
3、behavior是IE特有的屬性，直接寫入樣式表將導致頁面無法通過W3C的css驗證。使用以下腳本寫入behavior就可以解決這個問題，前提是頁面必須有一個外部樣式表 ，並且位於這個腳本的上面 。這種方法的不便之處每次只能添加一個選擇符。
<script type=”text/javascript”>
if (document.all && /MSIE (5/.5|6)/.test(navigator.userAgent) &&
document.styleSheets && document.styleSheets[0] && document.styleSheets[0].addRule)
{
document.styleSheets[0].addRule(’*', ‘behavior: url(iepngfix.htc)’);
document.styleSheets[0].addRule(’img’, ‘behavior: url(iepngfix.htc)’);
document.styleSheets[0].addRule(’div’, ‘behavior: url(iepngfix.htc)’);
}
</script>.
缺陷：
在文章開頭我就說過這個腳本不是完美的，一起來看看iepngfix.htc都有哪些短版吧。
1、使用PNG透明背景可能導致該元素內部鏈接無法點擊，尤其在鏈接具有float屬性 的時候，如：存在於一個浮動列表中的鏈接。推薦解決方法：使用display:inline代替float來實現塊級元素的的橫向排列。
2、img標籤的插入的透明PNG圖象無法使用右鍵保存，“另存爲”只能取到覆蓋在上面的blank.gif。什麼？不要blank.gif？等着吃叉燒包吧。
3、作爲背景的PNG圖象無法被平鋪，無法被定位 ，即background-repeat默認爲no-repeat，而background-position徹底失效。
4、在頁面剛載入的時候我們依舊能看到PNG圖象因爲IE6不支持而短暫出現的灰邊，時間取決頁面文件的大小和網絡速度。
5、作者建議爲使用PNG背景的元素設置一個固定寬度，但在我的使用中尚未發現width:auto會帶來什麼問題。
6、不支持低於5.5版本的瀏覽器，不過這個問題已經算不上問題。
