浏览器移动的线性渐变和url-image？

Question

我想有一个图像作为背景，并且也是CSS线性梯度：

background-image: url("/site/grigliatrasparente.png"), linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 

我dont'have与桌面浏览器（Firefox 44.x; IE 10;铬; Safari浏览器）的问题，但没有按” t与手机浏览器一起工作（我用我的iphone 5测试过，（9.x）用safari，app firefox，app chrome）。

我用这个：

background-image: url("/site/grigliatrasparente.png"), -moz-linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 
background-image: url("/site/grigliatrasparente.png"), -webkit-linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 
background-image: url("/site/grigliatrasparente.png"), -o-linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 
background-image: url("/site/grigliatrasparente.png"), -ms-linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 
background-image: url("/site/grigliatrasparente.png"), -webkit-gradient(linear, left bottom, right bottom, color-stop(0%,#404040), color-stop(2%,#dfbb80),color-stop(98%,#dfbb80),color-stop(100%,#404040)); 
background-image: url("/site/grigliatrasparente.png"), linear-gradient(left, #404040 0%, #dfbb80 2%,#dfbb80 98%,#404040 100%); 
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#404040, endColorstr=#dfbb80); 
background-color: #dfbb80; 

什么问题？

非常感谢和抱歉，我的英语水平:)

Answer 1

在CSS3的多重背景的初期，问题是渐变发生的背景IMG的地方，但事情得到解决，并在mozilla-developer你可以找到一个像你的想法一样正常工作的例子，也是可移动的。
你的CSS看起来很好，但你可以通过autoprefixr来运行它以获取更新的前缀。
在考虑可能是前缀干扰显示的可能性之前，首先检查您的手机的运行示例（当然还有css），并为背景图像设置背景重复和背景位置。

Answer 2

检查下面的jsfiddle链接。在我的例子中，非前缀线性渐变已被修正到最后大成：（在这种情况下，使用“为...”的方向）

background-image: url(http://placehold.it/350x150), linear-gradient(to right, #404040 0%, #dfbb80 2%, #dfbb80 98%, #404040 100%); 

https://jsfiddle.net/3u2Lhx6k/

更详细的信息：https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient。