PNG图像不透明度无法在浏览器中使用

Question

正如你在这里可以看到photoshop中的截图：

我将它保存为网络后，使用PNG-24格式，这就是我网站上的样子：

为什么我的浏览器上的图像不透明度不起作用？使用firefox。

实际PNG：

Answer 1

我不确定你想要的效果是什么，但我认为你希望渐变在底部消失。根据这个假设，渐变的问题在于它从顶部的棕色渐变到底部的白色。

你的渐变看起来像这样：

您想要将渐变两侧的颜色更改为相同的棕色，然后将右侧的不透明度降低到0％，如下所示：

我已经为你调整过了，所以这就是：

它在白色背景上看起来没有任何不同，但是当它在另一种颜色或纹理上时，你会看到差异。

Answer 2

你的Photoshop图层是否添加了一些效果？即，乘法等。这意味着该层依赖于并受其下方的影响。

Answer 3

多年前我面临同样的问题。当我们为web保存文件或图像时。它应该另存为网络＆amp;当我们以PNG格式保存时，请确保关闭所有背景图层。然后保存为web＆amp;从设置选项中选择PNG（24）。

＆安培;是确保您通过网络中图像的位置必须在标记中包含CSS。

background-color:none;