拉伸和缩放CSS背景

Question

有没有一种方法可以使CSS背景拉伸或缩放以填充其容器？

Answer 1

对于现代浏览器，您可以使用background-size以下命令完成此操作：

body {
    background-image: url(bg.jpg);
    background-size: cover;
}

cover 表示垂直或水平拉伸图像，因此它永远不会平铺/重复。

适用于Safari3（或更高版本），Chrome，Opera10 +，Firefox 3.6+和Internet Explorer 9（或更高版本）。

要使其与较低版本的Internet Explorer一起使用，请尝试以下CSS：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";