1. 程式人生 > >ie6半透明圖片處理方法

ie6半透明圖片處理方法

ie6支援png半透明圖片嗎?

ie6本身是支援png8索引色透明格式【firework儲存格式】的半透明圖片(相對於photoshop 儲存的png32的半透明效果會差些,對半透明要求不高時可儲存成png8索引色透明的格式即可),但不支援"png8 alpha透明度"的半透明圖片。

如何讓ie6也支援半透明圖片的顯示?

經過對比測試,引用DD_belatedPNG.js的方法是最簡單可靠的!
此方法支援背景平鋪、定位,但不支援table及td標籤的背景圖片透明,也可能會引起元素背景產生“畫素級”的移位;若出現背景圖移位現象可嘗試引入EvPNG.js檔案的方法代替,EvPNG.js也不支援table及td標籤的背景圖片透明

DD_belatedPNG.js怎麼使用?

<!--[if IE 6]>
<script type="text/javascript" src="DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.pngfix');//要使用半透明的標籤加上這個class值即可
// DD_belatedPNG.fix('*')//或者直接使用萬用字元,但比較耗資源
</script>
<![endif]-->

EvPNG.js怎麼使用?

同DD_belatedPNG的使用方法一樣,沒對比過原始碼,本身沒多大亮點,只是備用方法!

上面使用到ie才能識別的條件註釋來引用js,條件註釋怎麼用?

條件註釋屬性解釋:

gt : greater than,選擇條件版本以上版本,不包含條件版本
lt : less than,選擇條件版本以下版本,不包含條件版本 gte : greater than or equal,選擇條件版本以上版本,包含條件版本 lte : less than or equal,選擇條件版本以下版本,包含條件版本 ! : 選擇條件版本以外所有版本,無論高低

條件註釋使用方法:

<!--[if IE]> 所有的IE可識別 <![endif]-->
<!--[if !IE]> 所有非IE可識別 <![endif]-->
<!--[if IE 6]> 只有特定版本才能識別 <![endif]-->
<!--[if lt IE 7]>僅IE 7以下可見(不包含ie7)<![endif]-->
<!--[if lte IE 7]>IE 7及以下可見(包含ie7)<![endif]-->
<!--[if gt IE 7]>僅IE 7以上可見(不包含ie7)<![endif]-->
<!--[if gte IE 7]>僅IE 7以上可見(包含ie7)<![endif]-->
        

吐槽下:
iepngfix.htc方法:需要引用多個檔案,比較麻煩,容易出錯,不推薦!

贊助商連結

CSS濾鏡做背景圖片時不能平鋪(repeat),AlphaImageLoader屬性還會使DIV容器裡的連結失效,不推薦使用!

照現在的發展趨勢,ie6的使用比例會逐步加速下降,平時專案中除非必要,個人覺得應該優先考慮使用現代的技術html5+css3,不然就跟不上時代發展步伐啦!