我有 <div> 的样式在我的页面如下；
.maintab1{
background:rgb(0,65,135);
background:-moz-linear-gradient(-45deg, rgba(0,65,135,1) 0%, rgba(30,127,201,1) 29%, rgba(53,154,255,1) 62%);
background:-webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(0,65,135,1)), color-stop(29%,rgba(30,127,201,1)), color-stop(62%,rgba(53,154,255,1)));
background:-webkit-linear-gradient(-45deg, rgba(0,65,135,1) 0%,rgba(30,127,201,1) 29%,rgba(53,154,255,1) 62%);
background:-o-linear-gradient(-45deg, rgba(0,65,135,1) 0%,rgba(30,127,201,1) 29%,rgba(53,154,255,1) 62%);
background:-ms-linear-gradient(-45deg, rgba(0,65,135,1) 0%,rgba(30,127,201,1) 29%,rgba(53,154,255,1) 62%);
background:linear-gradient(-45deg, rgba(0,65,135,1) 0%,rgba(30,127,201,1) 29%,rgba(53,154,255,1) 62%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004187', endColorstr='#359aff',GradientType=1 );
}
我想包含一张图片 image.png作为背景图像以及 CSS3 渐变。
我检查了this stackoverflow question和 this article并以以下代码结束；
background-image:url(image.png), -moz-linear-gradient(-45deg, rgba(0,65,135,1) 0%, rgba(30,127,201,1) 29%, rgba(53,154,255,1) 62%);
并为所有其他属性应用了并且工作正常。
但这在 IE8 中不起作用(仅在 IE8 和 FF3+ 中测试过)并且相信不会在旧版本中起作用。渐变效果完美，但图像不出来。
有人能告诉我显示背景图片和 CSS3 渐变的方法吗？我已经提到的方法？
最佳答案
您可以使用 background-image: 来解决它.但这不适用于所有浏览器。更好的方法是将图像嵌套在 <div> 中或一些选择器并为父选择器提供渐变样式。这真的有效!!
关于css - 背景图像以及 CSS3 渐变，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10429033/