IE6下Png透明最佳解決方案

曾經一度的采用濾鏡的方法搞定這個問題，弊端是當有多個png圖片的時候，這就造成了css的壓力，得寫多少css代碼呀，也嘗試過js，缺點是不支持CSS中backgrond-position與background-repeat

 

這 個問題曾經困擾我許久許久……曾經一度的采用濾鏡的方法搞定這個問題，但是這種方法有個弊端。就是當有多個png圖片的時候，這就造成了css的壓力，得 寫多少css代碼呀。也嘗試過js，但是這些方法都有一個缺點,就是不支持CSS中backgrond-position與background- repeat.是否有一種方法能解決全站的ie6下png透明問題呢。

搜遍谷歌，發現了一個最完美的解決方案：DD_belatedPNG（點解連接 查看官方）.

原理

這個js插件使用了微軟的VML語言進行繪制,而其他多數解決PNG問題的js插件用的是AlphaImageLoader濾鏡.

使用方法

1.點擊這裡下載 DD_belatedPNG.js

2.在網頁中引用,如下:

復制代碼 代碼如下:
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script> _fcksavedurl=""DD_belatedPNG.js"></script>"
<script>
/* EXAMPLE */
DD_belatedPNG.fix('.png_bg');
/* 將 .png_bg 改成你應用了透明PNG的CSS選擇器 */
</script>
<![endif]-->

使用a:hover請留意

想要用透明PNG作為a:hover時的背景圖片,,需要以”a:hover”來作為選擇器

例：

復制代碼 代碼如下:

<!--[if IE 6]>
<script type="text/javascript" src="js/DD_belatedPNG.js" ></script>
<script type="text/javascript"> DD_belatedPNG.fix('.png_bg,.box a:hover');
</script>
<![endif]-->