Question

我希望同时拥有多个背景，它们会相互重叠。我知道它必须工作但不知何故它对我不起作用。

代码我：

body{
height:100%;
width:100%;
background: 
url("../images/background/top-img-bg.jpg") no-repeat center top,
url("../images/background/bottom-img-bg.jpg") no-repeat center bottom,
url("../images/background/overlay-pattern.png") repeat-x left top;
}

我想让图像贴在顶部，图像贴在底部，图像覆盖整个背景。

http://jsfiddle.net/8LtEk/

Answer 1

尝试将您的css分成如下所示的单独语句。使用逗号分隔各个背景图像并为任何其他背景属性保持相同的顺序：

background-image: url("../images/background/top-img-bg.jpg"), url("../images/background/bottom-img-bg.jpg"), url("../images/background/overlay-pattern.png");
background-position: center top, center bottom, left top;
background-repeat: no-repeat, no-repeat, repeat-x;

此外，这是CSS3功能之一，浏览器支持可能是罪魁祸首。

joomla同时具有多个背景

1 个答案: