无法将 Photoshop 不透明度转换为 CSS3

Question

我的 PSD 包含这样的内容：

如您所见，这是一个带有文本块的简单背景（颜色：#ffffff）。我在文本层上应用了 3% 的不透明度，如下所示：

当我尝试在 CSS 中重现此内容时，浏览器中的文本颜色要深得多，我不明白为什么：

这是CSS

.a-text {
  color:       rgba(255, 255, 255, 0.03);
  font-size:   200px;
  font-family: "Lato Black";
}

这不是颜色配置文件问题或其他问题。如您所见，背景颜色完全相同。这不是 CSS 规则冲突。我可能误解了透明度的问题。

感谢您的帮助:)

Answer 1

您的代码看起来是正确的，我认为您没有误解任何内容。当从图形工具移动到代码时，很难完全完美地复制字体和 effects/styles 放置在字体上。您所拥有的有点接近，您可能只想稍微提高不透明度。如果你需要你的图形在不透明阴影等方面是完美的，我建议使用 SVG。

Answer 2

您可以尝试 CSS 不透明度功能，理论上它应该产生与 rgba 值相同的结果——但谁知道呢。我怀疑结果因浏览器和 OS 而异。不能在这里测试。我也会选择bumping。

.a-text {
    color:       white;
    opacity:     .03;
    font-size:   200px;
    font-family: "Lato Black";
}

Can't convert Photoshop opacity to CSS3