将背景图像保留在底部

我一直在研究将图像保留在底部页面的解决方案。我目前得到的代码是：

.footer {
    background-image: url('images/footer.png');
    background-repeat: repeat-x;
    position: absolute;
    height: 950px;
    width: 100%;
    z-index: -101;
    bottom: 0;
}

然而，这有问题。我的目标是一个粘在底部并显示在其他所有内容后面的背景（因此 z-index 较低）。我为顶部部分提供了以下代码（有一个中间部分，只是块颜色，只是添加到主体中）：

.background {
    position: absolute;
    top: 0;
    width: 100%;
    height: 600px;
    background-image: url('images/sky.png');
    background-position: center;
    background-repeat: repeat-x;
    z-index: -100;
}

请注意：第一部分不起作用（它不在底部），但第二部分起作用（它在顶部）。
如果您想访问该网站，请随时访问：www.duffydesigns.co.uk/brough（请不要做出判断，这是一项正在进行的工作，一切都还没有真正完成！）。
谢谢您的帮助，
约瑟夫·达菲
注意：我相信你能弄清楚，顶部是天空，底部是草地和树木。

background-position接受两个参数，一个 x 值和一个 y 值，因此要将其定位在底部，您可以使用：background-position: center bottom;。您可以使用它来修复您的第一个示例。

有什么原因不能将背景作为背景body or the html标签？我不认为这是官方允许的html标签，但我从未见过它无法工作的浏览器（无论如何还没有......）。