我想有一个图像作为背景和CSS线性渐变：
background-image: url("/site/grigliatrasparente.png"),linear-gradient(left,#404040 0%,#dfbb80 2%,#dfbb80 98%,#404040 100%);
我不会遇到桌面浏览器(Firefox 44.x; IE 10; Chrome; Safari)的问题,但不适用于移动浏览器(我使用我的iphone 5测试,(9.x)使用safari,app firefox,app铬).
我用这个：
background-image: url("/site/grigliatrasparente.png"),-moz-linear-gradient(left,#404040 100%);
background-image: url("/site/grigliatrasparente.png"),-webkit-linear-gradient(left,-o-linear-gradient(left,-ms-linear-gradient(left,-webkit-gradient(linear,left bottom,right bottom,color-stop(0%,#404040),color-stop(2%,#dfbb80),color-stop(98%,color-stop(100%,#404040));
background-image: url("/site/grigliatrasparente.png"),#404040 100%);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#404040,endColorstr=#dfbb80);
background-color: #dfbb80;
有什么问题？
非常感谢,对不起我的英语:)
解决方法
在CSS3的多个背景的早期,问题是渐变取代了背景img,但事情得到了解决,在
mozilla-developer你可以找到一个像你的想法一样的例子,它也很好,也可以移动. 你的css看起来很好,虽然你可以通过autoprefixr来运行它来获得前缀更新. 在考虑其中一个前缀可能会干扰您的显示器之前,请先用手机检查功能示例(当然还有css)并为背景图像设置背景重复和背景位置.
