html - 如何定义多个 CSS 背景属性？

Question

有没有可能让这些背景一起工作？

background: url("../images/search.png") no-repeat scroll 9px 4px transparent;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0, #fdca14), color-stop(1, #ff8d02) );
background:-moz-linear-gradient( center top, #fdca14 0%, #ff8d02 100% );

谢谢 ：）

Answer 1

CSS3允许它。这是在同一背景中使用多个背景图像的示例：

.exampleClass {
    background-image: url(images/example1.png), url(images/example2.png);
    background-repeat: repeat-x, repeat;
}

所有主流浏览器都支持它（遗憾的是，IE8 和之前的浏览器除外）

Answer 2

如果您需要能够在较旧的 IE 浏览器中执行此操作，您可能还想查看CSS3 Pie 。

Answer 3

CSS

.class{
    background: url("../images/search.png") no-repeat scroll 9px 4px transparent,-webkit-gradient( linear, left top, left bottom, color-stop(0, #fdca14), color-stop(1, #ff8d02) ),-moz-linear-gradient( center top, #fdca14 0%, #ff8d02 100% );
}