Html 自动调整BG和黑色底条的大小

我正试图想办法把两者兼得，但我不知道怎么做

我在页面底部固定了一个黑条，使用：

body {
    background-image:url(../images/bottom_black.gif);
    background-repeat: repeat-x;
    background-position: 0px 800px;
}

工作正常，但我还需要一个径向渐变背景，因此我制作了一个，并放置了此代码，使其能够根据不同的分辨率自动调整大小：

html {
    background:url(../images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

他们各自独立工作，但不是一起工作。我知道他们都是背景图像，这就是为什么，但必须有一些工作围绕。请帮忙

以下是测试链接：

你可以试试这个

html {
    background:url(../images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
}

---

为什么不添加一个位置为：绝对的覆盖div；排名：0；左：0；身高：100%；宽度：100%；然后将黑色底部背景添加到该div？完美。谢谢工作完美