image - 设置 divs 背景图像以适合其大小？

Question

我有<div>一个背景图片。

<div>大小可能会随着时间而改变。

是否可以将 Divs 背景图像设置为适合<div>大小？

假设我有一个 div400x400和一个 Image 1000x1000，是否可以将图像缩小到400x400适合<div>尺寸？

score 62 · Accepted Answer

如果你想使用 CSS3，你可以很简单地使用background-size，像这样：

background-size: 100%;

所有主流浏览器（包括 IE9+）都支持它。如果您想让它在 IE8 及之前的版本中运行，请查看此问题的答案。

score 25 · Accepted Answer

用于background-size此目的：

background-size: 100% 100%;

更多关于：

http://www.w3schools.com/cssref/css3_pr_background-size.asp

score 16 · Accepted Answer

使用background-size属性来实现这一点。您应该在cover,contain和100%- 之间进行选择，具体取决于您想要获得的内容。

score 6 · Accepted Answer

您可以使用 background-size 属性来实现这一点，现在大多数浏览器都支持该属性。

要缩放背景图像以适合 div 内部：

background-size: contain;

缩放背景图像以覆盖整个 div：

background-size: cover;

score 1 · Accepted Answer

1

使用它，因为它也可以作为响应。：

background-size: cover;

于 2014-07-15T18:10:02.760 回答

score 1 · Accepted Answer

1

您可以为此使用 CSS3 background-size 属性。

.header .logo {
background-size: 100%;
}

于 2015-04-07T10:27:14.750 回答

score 0 · Accepted Answer

0

将您的CSS设置为此

img {
    max-width:100%,
    max-height100%
}

于 2013-03-09T16:42:35.547 回答

score 0 · Accepted Answer

想加个IE8及以下的解决方案（我觉得是IE5.5低），不能用background-size

div{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=
'/path/to/img.jpg', sizingMethod='scale');
}

8 回答 8