拉伸和缩放CSS背景 [英] Stretch and scale CSS background

问题描述

有没有办法在CSS中获得背景以扩展或缩放以填充其容器？

Is there a way to get a background in CSS to stretch or scale to fill its container?

推荐答案

，您可以使用 背景-size ：

For modern browsers, you can accomplish this by using background-size:

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

这将适用于Safari 3（或更高版本），Chrome， Opera 10+，Firefox 3.6+和Internet  Explorer 9（或更高版本）。

That would work for Safari 3 (or later), Chrome, Opera 10+, Firefox 3.6+, and Internet Explorer 9 (or later).

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

For it to work with lower verions of Internet Explorer, try these CSS:

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

这篇关于拉伸和缩放CSS背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！