2013-05-15 161 views
0

我使用这个reference来完成这项工作。但它似乎并没有这样做。我错过了什么?我只需要另一双眼睛就可以了。谢谢。将css3渐变与背景图像结合起来

背景图像显示,但不是渐变。这里有一个fiddle向你展示我的意思。

我在做什么错?

background: #23458E; 
    background-image: url('/static/images/grey.png'); /* fallback */ 
    background-image: url('/static/images/grey.png'), -webkit-gradient(linear, left top, left bottom, from(#23458E), to(#2661A8)); /* Saf4+, Chrome */ 
    background-image: url('/static/images/grey.png'), -webkit-linear-gradient(top, #23458E, #2661A8); /* Chrome 10+, Saf5.1+ */ 
    background-image: url('/static/images/grey.png'), -moz-linear-gradient(top, #23458E, #2661A8); /* FF3.6+ */ 
    background-image: url('/static/images/grey.png'),  -ms-linear-gradient(top, #23458E, #2661A8); /* IE10 */ 
    background-image: url('/static/images/grey.png'),  -o-linear-gradient(top, #23458E, #2661A8); /* Opera 11.10+ */ 
    background-image: url('/static/images/grey.png'),   linear-gradient(top, #23458E, #2661A8); /* W3C */ 
+0

看看这个:http://stackoverflow.com/questions/16450039/multiple-backgrounds-on-body/16450098#16450098 – Arbel

回答

3

图像是完全不透明的,因此它是在渐变之前指定的,因此它会覆盖渐变。

您的图像和渐变都是完全不透明的,所以目前还不清楚你想要用它们完成什么。解决您的问题是目前我能提供的最好解决方案。