[CSS] – 讓IE6支援PNG-24透明背景(多個方法)

1.用iepngfix

樣本：http://www.twinhelix.com/css/iepngfix/demo/ 

：http://www.twinhelix.com/css/iepngfix/

優點：能夠整個頁面都能自動處理PNG-24的透明背景，不用特意去做另一幅圖片代替等麻煩。

缺點：不能用太多，否則頁面載入速度大大變慢。

*************************************************************************************************

2.用濾鏡效果

雖然不是每個瀏覽器都能支援濾鏡，但只是為瞭解決PNG-24透明背景，就無所謂啦。

來源：有道的原始碼

<style>
body {
    background:url(bg.gif);
}
.test {
    width:451px;
    height:42px;
    background:url(test.png);
    _background:none;
    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.png',sizingMethod='crop');
}
</style>
<div class="test"></div>

優點：代碼少，簡單。

缺點：對PNG-24圖片的圖片都要用上濾鏡

*************************************************************************************************

3.用PNG-8的圖片代替

來源：網路

PNG-8一般都是用PS儲存：(在“檔案->儲存為Web和裝置所用格式”上儲存,有時候會用上裡的“擴散透明度仿色”)

優點：不用像上面所說那樣處理

缺點：如果有圓角的話，會看起來有點直角的感覺，如果圖片外邊有漸層（包括陰影製作效果）會很容易讓陰影的大部分顏色被其它顏色所代替，產生失真大

*************************************************************************************************

4.使用CSS hack

能讓PNG-24正常顯示的就直接顯示，否則使用CSS hack來替換其它格式圖片(如jpg)，這個方法是看別人的源碼才知道的，屬於最無奈的方法。

優點：暫時想不到，至少能讓圖片正常一點的顯示。

缺點：網站的檔案多，佔用空間大，修改不方便。

*************************************************************************************************

PS：PNG-8與GIF的透明背景都能讓IE6直接顯示，但與PNG-24對比，圖片失真得太離譜了