html - 背景内容图片需要贴在底部

Question

我正在尝试推送我的背景内容图像并使其固定在我的页面底部。该图像不是页脚，因为图像将位于某些内容的后面。但是，当内容很少时，图像不应该在顶部被截断，而当内容很多时，图像应该贴在底部!

还没有任何工作。有人对我有什么建议吗？

这里有两个例子。一个内容适合窗口，另一个内容更多。

这里有两个链接；

http://www.andrewa.org/testing/mosaik-test/content-imagebottom-test.html

http://www.andrewa.org/testing/mosaik-test/content-imagebottom-test2.html

提前谢谢大家!

Answer 1

我会使用 background-attachment: fixed; 将图像作为 body 的背景并添加:

html, body {
  height: 100%;
}

所以总数是:

html, body {
  height: 100%;
}
body {
  background-image: url("images/bg_content.gif");
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
}