html - 2个背景，1个覆盖宽度，其他重复，无法使em工作

奇怪的是，但是我想在网页上有2个背景，第一个我想停留在顶部（因此按正常方式滚动），一旦滚动，便获得了第二个背景。

我想要覆盖页面宽度的第一个背景（所以我用了'cover'）
我想不断重复的第二个背景。我已经尝试过各种方式来弄乱代码，这是我的当前代码（它具有第一个bg静态值，因此第二个bg目前暂未显示！抱怨……）

            background-image: url(http://www.scottdaviesdesign.co.uk/hotel/death/header.jpg); url(http://www.scottdaviesdesign.co.uk/hotel/death/bg.jpg);
            background-position: center top, center center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
            background-color:#464646;
            }
            }

我修复它的原因是因为我使它滚动，自动或以其他方式拉伸图像（因为图像比浏览器宽，因此它可以在其他设备上放大/缩小...最终大声笑）

谢谢！
史考特

最佳答案

这是您要尝试做的事情吗？

的CSS

html, body{
    width:100%;
    height:100%;
    margin:0px;
    background-image:url('http://www.scottdaviesdesign.co.uk/hotel/death/bg.jpg');
    background-position: center top, center center;
    background-attachment: fixed;
    background-color:#464646;
}
#div1{
    background-image: url('http://www.scottdaviesdesign.co.uk/hotel/death/header.jpg');
    background-position: center top, center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    width:100%;
    height:100%;
}

的HTML

<div id="div1"></div>

这实际上是用div覆盖页面的顶部，该div覆盖了窗口的整个宽度和高度，然后随页面滚动。

JSfiddle