CSS - 如何添加第二个背景图像

Question

请求:

我试图让我的网站有一个背景，它沿 x 轴重复，但当它在 y 轴上完成时，它显示不同的图像。我希望它继续。

示例:

---------------
|             |
| (ORIGINAL)  | (repeats on x-axis)
|             |
---------------
|  (SECOND)   |
|             |
---------------
|  (SECOND)   |
|             |
---------------
|  (SECOND)   |
|             |
---------------
|  (SECOND)   |
|             |
---------------

(等等)

我将如何完成这个？

Answer 1

使用多背景 CSS3 功能 http://www.w3.org/TR/css3-background/#layering

在 http://jsfiddle.net/pWw2A/ 查看 jsfiddle 实例

 body {
  background: url(http://placehold.it/150x80/ff0000/ffffff) repeat-x,
   url(http://placehold.it/150x50/00ff00/000000) 0 80px repeat-y;                
  }