html - 透明像素在 PC 和 iPhone 上呈现不同

Question

在 Photoshop 中生成透明像素。

在 PC 上它看起来像预期的那样，在 iPhone 上它看起来更暗。

div {
    background-image: url('/images/pixel-white.png');
}

浏览器：

PC - Chrome 版本 22.0.1229.96 m

iPhone - 21.0.1180.82

像素：PNG-24 / 透明层：rgb 255 255 255，透明度60%

问题：如何使这个像素在 PC、iPhone 和所有其他浏览器上看起来一样？

添加：

在此处输入图像描述

score 3 · Accepted Answer

您不只是使用应该有一个非常特殊的原因：

background: rgba(255,255,255,0.6);

或类似的东西。

（这不是评论，请使用rgba。）

score 2 · Accepted Answer

如何使这个像素在 PC 和 iPhone 上看起来一样？

你不能。它不仅取决于浏览器，还取决于操作系统和显示设备，以及使用设备的用户如何配置显示。

这是您无法从映像内部或服务器端控制的事情，尤其是当您在这里尝试比较不同的计算机系统时。

score 0 · Accepted Answer

为了实现与所有浏览器 (IE6+) 的 100% 兼容性，我使用了以下帖子中的建议：

尽管上述主题仅适用于 Mobile Safari 浏览器 - 我确认将透明像素设置为超过 1px 的宽度/高度的做法正在解决所有主要浏览器 (IE6+) 的外观不一致的问题。

换句话说，根据 PNG 的 RFC：http ://www.ietf.org/rfc/rfc2083.txt，您的透明像素需要至少 2px 宽/高才能在所有浏览器中看起来像预期的那样。

3 回答 3