html - 即使页面放大或缩小，如何保持固定的背景图像大小？

Question

我有一张图像，我想将其设置为尺寸为 1x700 的背景。

这是一种渐变图像，所以我需要它来repeat-x。

我遇到的主要问题是图像没有填满整个页面。然而，它保持不变。具体来说，当我向外滚动时，我可以看到图像没有填满整个页面。

我的代码适用于 firefox 和 chrome，但不适用于 IE9。如果有任何不同，我也会将此皮肤应用于 dotnetnuke。

这是我的代码:

body 
{   
    background-image: url('images/bg.jpg');
    background-attachment: fixed;
    background-repeat: repeat-x;
    background-size: contain;
    -moz-background-size: contain;
}

Answer 1

不确定我是否理解正确:

要使图像适合全屏，请使用 CSS 属性:

background-size:100% 100%;

但是请注意，如果尺寸不正确，它会拉伸(stretch)图像