html - 显示银条的渐变图像

Question

我使用了带有渐变的图像作为背景图像@:http://lotcapture.burnseo.com/

图像具有 Photoshop 渐变效果并保存为 png。 据我所知，这只发生在 Mac 上的 Chrome 中，但它严重困扰着我，因为我无法弄清楚为什么渐变图像会在渐变所在的位置显示银色条:

CSS:

.wide-slider {
position: relative;
width: 100%;
background-image: url('/images/sky-home.png');
padding-left: 100%;
margin-left: -100%;
background-repeat: repeat-x;
padding-right: 100%;
margin-right: -100%;
top: -80px;
border-top: solid 5px #E9E9E9;

如有任何反馈，我们将不胜感激。谢谢。

Answer 1

我认为您说的是 Photoshop 中的“图层蒙版”:

The image was saved with a gradient in Photoshop. It was created in Photoshop with a gradient from black to transparent so the the sky image shows at the top and then fades at the bottom.

我试图只显示背景图像(链接是 this one )，但我没有看到渐变透明的渐变，所以问题出在你的图像上，而不是浏览器的渲染中，也是因为在 Firefox 和 Chrome for Windows 中，它以相同的方式出现。