CSS3多个背景无法正常工作

Question

我正在尝试使用CSS3创建一个具有两个背景的简单div.我已经创建了一个JS Fiddle,其中包含了我在这里尝试做的一个例子:http://jsfiddle.net/nfcyv/

然而,这是行不通的,我希望有人可以指出为什么或给我一个有用的暗示.

以下是CSS的副本:

#box { background:url("http://i.imgur.com/pAmGs.png") no-repeat scroll center bottom #000, url("http://i.imgur.com/fDMpm.png") repeat scroll 0 0 #000;height:500px;width:500px }

Answer 1

您只能为最后一个图层指定背景颜色,因此您需要#000从声明中删除第一个颜色:

#box {
    background:url("http://i.imgur.com/pAmGs.png") no-repeat scroll center bottom, 
               url("http://i.imgur.com/fDMpm.png") repeat scroll 0 0 #000;
    height:500px;
    width:500px
}

更新了小提琴