PNG图像不透明度在浏览器中不起作用

Question

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

​

​

在我使用PNG-24格式将其保存为web后，它在我的网站上是这样的：

​

​

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

实际的PNG：

​

​

Answer 1

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

您的渐变看起来像这样：

​

​

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

​

​

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

​

​

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

Answer 2

你的Photoshop图层添加了一些效果吗？也就是说，乘法等。这将意味着层是依赖的，并受其下面的内容影响。

Answer 3

很久以前我就遇到过同样的问题。当我们为web保存文件或图像时。它应该是PNG保存为网页&当我们保存为PNG格式时，请确保所有的背景层关闭。然后只需保存为web并从设置选项中选择PNG(24)。

是，请确保您在web中放置图像的位置必须在标签中包含CSS。

background-color:none;