为什么此PNG图像在Chrome和Firefox中的显示与在Safari和IE中的显示不同？

检查此图像：

在Chrome和Firefox上，它将显示为梨。现在，尝试保存它并查看保存在桌面上的它。另外，尝试在Safari或Internet Explorer中查看。它将显示为苹果！

尝试单击图像并四处移动。您会注意到苹果出现了。

为什么会这样？

发生这种情况是因为某些浏览器执行了图像文件中指定的伽玛校正。

这是未校正的图像。苹果图片中的“白色”像素包含梨的图片，以更高的强度存储，即非常明亮。

这是经过伽玛校正的图像。梨图片中的“黑色”像素包含苹果图片，以相当正常的强度存储，但通过伽玛校正将其缩小到接近黑色。

在屏幕上，我可以在第一个图像的白色像素中微弱地看到梨，但是在第二个图像中，苹果与周围的黑色像素没有区别。

（您可能还会在经过伽玛校正的梨上看到一些色带，因为未经校正的图像使用的色域范围要小得多。）

PNG图像文件包含一个gAMA块，该gAMA块指定文件的伽马值为0.02。在不进行伽玛校正的情况下显示时，观看者会看到一个散布着“白色”像素的苹果，实际上是原始（高）强度的梨。

当使用伽玛校正显示时，观看者会看到带有“黑色”像素的经过颜色校正的梨，实际上是苹果以较低的伽玛值渲染的图像。

显示梨的浏览器正在对图像执行伽玛校正，而显示苹果的浏览器不在进行伽玛校正，而只是使用文字颜色值对其进行显示。

对于评论来说，这有点太多了，但希望对您有所帮助。

因此，我可以肯定地说，这个问题与浏览器使用PNG解释伽玛信息的方式有关。这是一个非常有趣的问题，并且首先处理了伽玛信息的歧义。

文章PNG伽玛“校正”的哀伤的故事提供了问题，补救措施，以及其他有趣的事实的一个非常好的总结。

话虽如此，我们实际上可以使用以下方法从图像中去除伽玛信息 pngcrush

pngcrush -rem gAMA -rem cHRM -rem iCCP -rem sRGB pear.png apple.png

因此，有了伽玛信息，没有它：

我不会真的说这是“答案”，但如果有的话，可能是正确的方向。我敢肯定，如果有人对颜色配置文件有很多了解，等等，那么他们会给出更正式的答复。

更改图像的伽玛（γ）在于修改以下值的伽玛：

（R'，G'，B'）=（^Rγ，^Gγ，^Bγ）

在将伽马函数应用于初始像素值（R，G，B）（考虑R，G和B归一化在0和1之间）后，给出在屏幕上显示的输出像素颜色（R'，G'，B'）。 ）。

现在，让我们以红色通道为例。
如果R = R0 + R1，就会获得
R” =（R0 + R1）^γ = R0 ^γ *（1 + R1 / R0）^γ

如果R0小于R1更大，则必须
（1 + R1 / R0）^γ ≈1 +γ R1 / R0，
所以R”≈R0 ^γ +γ R1 * R0 ^γ-1

这意味着，对于伽马接近0，R0 ^γ占主导地位。对于γ= 1，您将获得
R'≈R0 + R1

对于较大的伽玛，第二项占主导地位，因此您可以直接设置R0 =梨的红色成分和R1 =苹果的红色成分，并且R0比R1大得多，并且在更改伽玛值时将获得所需的变化。您的显示器（或每个软件使用的特定伽玛曲线）。

这不是四舍五入的像素，ICC颜色配置文件也不是问题。

这是一个技巧图像，某些浏览器显示的PNG没有伽玛数据。对于这些浏览器，您会看到一件事，对于其他浏览器，您将看到完整图像（梨隐藏在背景中）。

根据浏览器是否支持此伽玛数据，我看到的是苹果/梨的把戏图像，或者只是看到的梨。

碰巧的是，您可以在具有正确校准显示的图片中查看更多细节，如果伽玛/亮度/对比度过高，则可以看到图片中的一张图像被隐藏得更多。