Firefox 中的 css 渐变不是静态的

Question

第一次发帖，希望有人能帮忙。

我在使用 ajax 的页面上有一个渐变背景(调用后变得很长)。

在 IE(版本 9)中，当我向下滚动时，渐变背景保持不变，但在 Firefox(版本 6)中，渐变对于一个正常的页面长度是正确的，但当我向下滚动时，背景渐变会自行重复。

有什么方法可以让 firefox 和 IE 一样(无论我滚动多远都保持不变？

这是我的与渐变相关的 CSS:

html {
    background-color: #8c827a;
    height: 100%;
    margin: 0 0 1px;
    padding: 15px;

    /* Mozilla: */
    background: -moz-linear-gradient(top, #8c827a, #2B2825);
    /* Chrome, Safari:*/
    background: -webkit-gradient(linear,
                left top, left bottom, from(#8c827a), to(#2B2825));
    /* MSIE */
    filter: progid:DXImageTransform.Microsoft.Gradient(
                StartColorStr='#8c827a', EndColorStr='#2B2825', GradientType=0);
}

Answer 1

要使其他浏览器的行为与 Internet Explorer 相同，您可以使背景固定:

html {
    background-attachment: fixed
}

确保在两个 background 声明之后放置 background-attachment。