我有以下徽标，它显示为与 FF3、Chrome (#363636) 中的 HTML 正文相同的背景颜色。
但在 IE8 中，它显示不同的、较暗的颜色。
这个 FF3/Chrome 是原谅我的 PNG，还是只是另一个 IE 错误（我认为他们修复了 IE7 中的 PNG 支持）？
更新：我仍然遇到这个问题，我用来纠正它的 pngcrush 参数是：
pngcrush -replace_gamma 0.5181347 infile.png outfile.png
Win32 二进制链接在这里。
Chris
问问题
23791 次
7 回答
22
您的 PNG 中有一个伽马校正信息（gAMA 块）结构。如果您正在处理需要伽玛校正的照片，那很好，但这对于网络来说不是正确的。
在网络上，浏览器通常不会对 HTML/CSS 颜色或其他图像应用 gamma 校正，因此如果您使用 gamma 校正，您的 PNG 上的结果将与页面的其余部分不一致。出于这个确切原因，某些浏览器不应用 PNG gamma，这就是您获得可变结果的原因。
将徽标加载到图像编辑器中并在没有 gAMA 块信息的情况下将其保存回来。更多。
于 2009-03-19T16:59:20.800 回答
6
这里评价最高的答案建议使用 pngcrush 将伽马值重置为 0.5181347。这可能适用于某些领域，但在我们的情况下，您最好的方法是从 PNG 中去除所有颜色空间信息，以便它完全呈现在浏览器用于 CSS 中颜色的相同中性 RGB 三元组空间中：
pngcrush -rem cHRM -rem gAMA -rem iCCP -rem sRGB infile.png outfile.png
对于真正的色头来说，这意味着您设计的原始颜色可能在另一台显示器或操作系统上看起来不一样，但您所有具有相同 RGB 值的颜色将根据浏览器为每个用户呈现相同的方式+操作系统他们在。具体来说，与 PNG 相邻的背景或相邻颜色将匹配，因此您可以使用互锁的图像和颜色设计您的网站。
于 2010-09-19T18:52:10.143 回答
2
我已经讨论了Internet Explorer 中的 PNG 颜色问题及其屏幕截图解决方案。解决方案是从 PNG 图像中删除 gamma 块（例如使用 TweakPNG 实用程序）。这使得图像在 Internet Explorer 中以正确的阴影呈现。一些不常见的浏览器可能仍会出现异常行为。
于 2011-03-08T12:48:16.930 回答
0
您需要从 PNG 中删除 gAMA 和 sRGB 块。此外，您需要删除附加到图像的任何 ICC 颜色/颜色配置文件。
Photoshop“保存到 Web”添加了一个标准的 sRGB ICC 配置文件 - 这对于内容图像非常有用，但对于需要与 CSS 颜色匹配的图像样式则完全错误。
这在 Safari 中尤其明显——我有一篇关于它的博客文章。
于 2009-04-27T13:22:19.623 回答
0
我在所有 IE 中都注意到了这个问题——6、7、8。一些 PNG 图像在透明区域周围会有黑色轮廓。原来我必须打开 Gimp（我的免费跨平台图像编辑器），打开有问题的 PNG，然后使用 150% 上的模糊选择工具重新选择透明区域，然后单击删除。然后重新保存。这通常可以解决大约 98% 的透明区域中 PNG 周围的斑点。
如果这不起作用，则在 Gimp 中重新加载，将背景设置为白色，选择拼合图像，将模糊选择阈值设置为 3%，选择要删除的背景，选择删除（清除），然后再次重新选择背景阈值为 150%，删除，然后重新保存图像。
注意我的模糊选择工具，我的 Gimp 设置是选中抗锯齿，取消选中羽化边缘，选中选择透明区域，取消选中样本合并，然后按合成选择。
是的，这似乎是一个带有透明背景的 PNG 图像的 IE 错误。其他浏览器——Opera、Safari、Firefox、Chrome——都没有这个问题。我怀疑某些图像程序将透明度设置为 50% 作为边缘上某种抗锯齿的一部分，因为只有边缘有问题。我认为非 IE 浏览器处理像素上 50% 的透明度，但 IE 可能只能理解像素上的 100% 透明度——只是一种预感。
于 2009-10-26T20:41:14.353 回答
0
这是唯一对我有用的解决方案：http: //forum.jquery.com/topic/transparent-png-shows-black-edges-in-ie8
于 2010-12-08T09:34:59.483 回答
0
知道使用Yahoo Smushit优化网络图像为我纠正了这个问题，这可能对其他人有用（一般来说，通过这个或类似的方法运行图像是一个好主意）。
于 2013-03-12T23:20:27.700 回答