使用多个背景时指定背景重复和位置

Question

我试图应用两个背景图像。一个是我想沿x轴重复的颜色重复块。另一个只是我想只出现一次的单个图像。

我已经使用了多个背景图像来尝试获取应用于同一div的两个图像，但是我不确定如何将特定背景规则定位到每个背景。

背景1需要有top和repeat-x的位置。 背景2需要有一个右上和不重复的位置。

这是可能的多个背景，或者我将不得不回到两个单独的div嵌套的旧方式？

JS小提琴：http://jsfiddle.net/nnq4S/

灰色背景应该跨越容器的整个顶部，而色带应该留在原地。

Answer 1

我没有一个测试方便，但这是否工作？

background:url(bg1.png) top left repeat-x, url(bg2.png) top right no-repeat;