Question

我在理解缩放或扩展CSS图像的正确语法方面遇到了问题。

我尝试了很多东西，但我无法让它正常工作。

我目前使用的代码是

background:url(../images/body_bg1.jpg) fixed repeat-y; width:100%; height:100%;}

目前使用上面的代码，当我使用repeat-y时，图片会在页面左侧平铺，并将其平铺在页面顶部。

根据我的阅读，我应该可以使用上面的语法来修复和拉伸我的图像我在这里遗漏了什么？

同样使用上面的代码可以格式化这样的代码，这样更容易阅读吗？

background:url(../images/body_bg1.jpg) fixed repeat-y; 
width:100%; 
height:100%;}

Answer 1

这个功能刚刚用css3实现。所以它不会在稍微旧的浏览器中运行。

div
{
background-image:url('myBG.jpg');
background-repeat:no-repeat;
background-size:cover;
}

查看此网站。如果你问我，这是一个非常酷的网站。 http://www.w3schools.com/cssref/css3_pr_background-size.asp

编辑：在较旧的浏览器中，如果没有常规

的解决方法，则根本不可能

<image src=""/>

在您的内容背景中。

Answer 2

实际上要延长背景，你必须指定元素中的宽度和高度，或者使用contains：

div
{
background-image:url('image.png');
background-repeat:no-repeat;
background-size:100% 100%;
/*background-size:contain;*/
}

使用封面将拉伸一侧并溢出另一侧

Answer 3

你应该在这里使用CSS background-size属性：methinks：

background-size:[width] [height];
background-repeat:repeat-y;

如果您只提供一个，则第二个值将设置为自动。