我的透明 PNG 图像出现问题，显示图像非透明部分边缘周围的黑色抖动像素伪影。它仅在 Internet Explorer 中执行此操作，并且仅在使用它的 Javascript 文件中执行此操作。
这就是我所说的......
http://70.86.157.71/test/test3.htm（链接现已失效）......注意右下角的女孩。她在 IE8 中有一些工件（我没有在以前版本的 IE 中测试过它，但我假设它可能会做同样的事情）。它在 Firefox 和 Chrome 中完美运行。图像从 Javascript 文件加载以产生鼠标悬停效果。
如果你自己加载图像，它工作正常。这是图像...
http://70.86.157.71/test/consultant2.png
如何解决这个问题？
该图像是在 Photoshop CS3 中生成的。
我读过有关删除 Gama 的内容，但这显然是在以前版本的 Photoshop 中，当我在 TweakPNG 中加载它时，它没有 Gama。
固定的！
我一直在努力解决同样的问题，刚刚取得了突破！我们已经确定，如果您为图像提供背景颜色或图像，则 png 会正确显示在其顶部。黑色边框消失了，但现在你有一个不透明的背景，这几乎违背了目的。
然后我想起了我遇到的 rgba 到 ie 过滤器转换器。（感谢迈克尔·贝斯特）。所以我想知道如果我给我的问题 png 一个 ie 过滤背景模拟 rgba(255,255,255,0) 会发生什么，完全期望它不起作用，但无论如何让我们尝试一下......
.item img {
background: transparent;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); /* IE6 & 7 */
zoom: 1;
}
快！再见黑色，你好 ie7 和 8 中的 alpha 通道。淡入淡出你的 png，或者在屏幕上设置动画 - 一切都很好。
我把它放到一个 jQuery 插件中以使其更加module化（你提供透明的 gif）：
$.fn.pngFix = function() {
if (!$.browser.msie || $.browser.version >= 9) { return $(this); }
return $(this).each(function() {
var img = $(this),
src = img.attr('src');
img.attr('src', '/images/general/transparent.gif')
.css('filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + src + "')");
});
};
用法：
$('.my-selector').pngFix();
注意：如果您的图像是背景图像，它也适用。只需在 div 上应用该函数。
我知道这个线程已经死了一段时间，但这里是旧 ie8 png 背景问题的另一个答案。
您也可以使用 IE 的专有过滤系统在 CSS 中做到这一点，如下所示：
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src='pathToYourPNG');
您需要在背景声明中为“第一个”图像使用 blank.gif。这只是为了混淆ie8，防止它同时使用你设置的过滤器和背景，只使用过滤器。其他浏览器支持多个背景图像，并且会理解背景声明而不理解过滤器，因此仅使用背景。
您可能还需要在过滤器中使用 sizingMethod 以使其按您想要的方式工作。
我有同样的事情发生在具有透明度的 PNG 中，该透明度被设置为应用了不透明度的 <A> 元素的背景图像。
修复方法是设置 <A> 元素的背景颜色。
因此，以下内容：
filter: alpha(opacity=40);
-moz-opacity: 0.4;
-khtml-opacity: 0.4;
opacity: 0.4;
background-image: ...;
变成：
/* "Overwritten" by the background-image. However this fixes the IE7 and IE8 PNG-transparency-plus-opacity bug. */
background-color: #FFFFFF;
filter: alpha(opacity=40);
-moz-opacity: 0.4;
-khtml-opacity: 0.4;
opacity: 0.4;
background-image: ...;
丹的解决方案对我有用。我试图用背景图像淡化一个 div。注意事项：您不能直接淡化 div，而是淡化包装图像。此外，添加以下过滤器以应用背景图像：
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='image',src='assets/img/bgSmall.png')"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='image',src='assets/img/bgSmall.png'); /* IE6 & 7 */
请注意，过滤器的 src 属性中的路径是绝对的，而不是相对于 css 表。
我还补充道：
background: transparent\9;
这会导致 IE 忽略我之前为其他浏览器声明的实际背景图像。
谢谢丹！！！