CSS 具有不同背景大小的多个背景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11468604/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple backgrounds with different background-size
提问by Mattias
I am trying to create a page background with an overlay using css3's multiple background support;
我正在尝试使用css3的多背景支持创建带有叠加层的页面背景；
html, body {
background: url('https://github.com/jaysalvat/vegas/raw/master/overlays/01.png') repeat,
url('http://farm8.staticflickr.com/7260/7502004958_595bf03fbf_z.jpg') top left no-repeat;
background-size: cover;
}?
I want the photo background image to "cover" the page and the overlay to be small (3*3px) repeating over the hole page.
我希望照片背景图像“覆盖”页面，并且覆盖层很小（3 * 3px）在孔页面上重复。
The above example gives me http://jsfiddle.net/tpmD4/(also the overlay covering the page).
上面的例子给了我http://jsfiddle.net/tpmD4/（也是覆盖页面的覆盖层）。
How can I fix that?
我该如何解决？
When I try to specify the background-sizefor both of the images (background-size: 3px 3px, cover;); then the image background doesn't cover, but the overlay works.
当我尝试为两个图像 ( )指定背景大小时background-size: 3px 3px, cover;；那么图像背景没有覆盖，但覆盖层有效。
回答by Billy Moat
Here you go:
干得好：
html, body {
background-image: url(01.png), url(z.jpg);
background-repeat: repeat, no-repeat;
background-position: 0 0;
background-size: 3px 3px, cover;
}
