我将忽略您问题中的实际图片，而只是回答标题中暗示的问题：如何创建在黑色背景上看起来与在白色背景上看起来不同的 PNG 图像？

具体来说，我将描述的方法将允许您将任意两个灰度图像A和B合并到一个 PNG 文件C中，这样C在黑色背景上看起来像A ，在白色背景上看起来像B，但有一个条件：每个像素A的像素必须等于或比B的相应像素更暗。（如果原始图像不完全满足该条件，我将描述的方法将强制它们，导致一些“鬼像”从一个到另一个泄漏。根据图像，这可能是视觉上的，也可能不是明显。）

当然，诀窍是利用 PNG alpha（= 不透明度）通道。具体来说，给定一个颜色为c且不透明度为 α的像素，该像素将在黑色背景上具有明显的颜色a = αc ，在白色背景上具有b = αc + (1- α )。（这里，颜色 0.0 代表黑色，1.0 代表白色。）反过来，给定目标像素颜色a和b，我们可以求解c和α的这些方程：

• 1 - α = b - a
  ⇒   α = 1 - ( b - a ) = 1 - b + a，和
• c = a / α

（当然，这假设a ≤ b；否则透明度 1 - α将是负数，可惜 PNG 格式不支持。）

好的，那么我们如何在 GIMP 或 Photoshop 等图形编辑器中进行这些计算呢？好吧，我们真的只需要两个操作——减法和除法——而且，碰巧的是，GIMP（如果我没完全弄错的话，Photoshop也是）将这两种操作都实现为图层合成模式。

实际上，该过程与我在此答案中描述的从叠加在黑白背景上的版本重建图像的 alpha 通道的过程基本相同；唯一的区别是我们从两个任意图像开始——例如，这两张来自 Wikimedia Commons 的猫照片：

我裁剪了这些图像，将它们转换为灰度并调整了它们的颜色级别，以使它们几乎（但不完全）满足相对亮度条件a ≤ b。（提示：“仅变亮”和/或“仅变暗”图层模式便于检查。）

现在，我将执行以下步骤：

• 将两个图像作为单张图片的图层打开。
• 制作黑猫图层的副本，将其图层模式更改为“减法”并将其合并到白猫图层中。结果将是最终图像的透明度。
• 制作我们刚刚创建的透明图层的副本，将其反转，将其图层模式更改为“分割”并将其合并到黑猫图层的剩余副本。这将是最终图像的亮度通道。
• 将透明层移到顶部并使其可见，然后使用通道对话框将其传输到选区。然后选择亮度层并从中剪下选区。最后，删除透明层。
• 将剩余的图层另存为 PNG。它应该如下所示：

此页面为白色背景，因此您应该看到白色小猫图像（但不满足a ≤ b条件的另一张图像有一些微弱的“幽灵”），但您可以下载上面的图像并确认它在黑色背景上看起来完全不同。或者只是分别在黑色、白色和紫色背景上比较这些扁平化版本：

最后一个版本显示了正在发生的事情：紫色区域是上面的 PNG 透明的地方，允许背景颜色显示出来。相反，黑色和白色区域是 PNG 图像不透明的地方，使颜色与背景无关。

好的，我终于开始看示例图像了，诀窍很简单：伽玛校正。

正如其他人所指出的，该图像由两张交错的图片组成：在每 2 × 2 像素块中，三个像素的 RGB 值在 0 到 210 范围内，并显示“床上的红色虎斑小猫”图像，而一个像素具有 214 到 255 范围内的 RGB 值，并显示了“蝙蝠侠猫”图像的非常明亮的版本。

这是图像的一小部分，放大了 8 倍，没有应用伽马校正。如果您在不了解 PNG 伽马校正的程序中打开图像并放大，您会看到以下内容：

如您所见，浅色像素（包含“蝙蝠侠猫”图像）看起来几乎是白色的. 在正常放大倍率下，它们与另一张对比度更高的图像融合在一起，只是让它看起来更亮一些。

但是，PNG 图像还包含一个gAMA块，它指定文件 gamma 值为 0.023。这是一个极小的伽玛值；更典型的值在 1.0 和 0.45 之间。当在支持 PNG gamma 校正的程序中打开时，这会导致图像变暗，以至于“床上的小猫”图像实际上变得不可见——它的所有颜色都映射为黑色——而“蝙蝠侠猫”图像的颜色映射到更普通的值。

例如，这是经过伽马校正后图像的相同放大部分：

因此，总而言之，此图像的外观不取决于背景的颜色。 相反，这取决于您用来查看它的程序是否支持 PNG 伽马校正（并且愿意应用这种极端的伽马值）。

顺便说一句，图像中使用的伽马校正值似乎有点过于极端：至少在我的屏幕上，如果将伽马加倍，“蝙蝠侠猫”图像会显示得更好。

该图像是交错的两个图像。基本上，隔行扫描是通过以交替模式显示每个图像的单行（或像素）来同时显示两个图像。

通常人们会在电视和视频广播中发现这一点，因为帧速率掩盖了隔行扫描效果。

如果要拍摄这张照片并使用去隔行过滤器（“偶数场”），蝙蝠侠图像就会消失。此外，蝙蝠侠猫图像在缩放到 50% 或使用 Photoshop 的缩放功能时变为“主要”，可能是因为插值/重采样。奇怪的是，当您提交缩放更改并且 Photoshop 以全质量重新渲染（它在操作变换时使用快速渲染方法）时，另一只猫再次变为“主要”。同样缩放到 25% 也消除了蝙蝠侠猫。

至于“为什么”显示会根据软件而变化，这很可能是各种软件用于渲染图像的方法的功能。我检查了文件的标题，它看起来格式正确，但在一个可选部分（它有 3 个可选块 IIRC）中可能实施了一些技巧或黑客攻击，它利用了渲染错误。就个人而言，我认为这只是基于我上面提到的重新缩放的东西使用的插值方法。此外，标题中有一个伽马部分，在我的显示器上，图像真的很暗，所以它可能只是利用了一些像素更亮而其余像素与深色背景融合的事实。

我对您链接到的 PNG 进行了测试，两次都得到了相同的图片，所以我看不出您在问什么。

PNG 有一个 alpha 通道，它允许颜色具有不同程度的不透明度。这可能是不同颜色背景发生变化的原因。