如何调整div的背景图片？(How to adjust background image of a div?)

我不能调整div的背景img所以它被图像填充，无论div和img的大小。如果图像较小则应该拉伸，反之亦然。无论变形和质量损失如何，整个图像都应该是可见的。

我尝试了所有这些组合和排列，以及更多。简单 - 不起作用。

background-repeat: no-repeat; background-position: top center; background-size: auto; background-size: cover; background-size: contain; background-size: 100% 100%;

根据W3C验证器，我使用Firefox 22，css是有效的css3。

I can't adjust background img of a div so it is filled by the image, regardless of div's and img's size. If the image is smaller then it should be streched and vice versa. The whole image should be visible, regardless of deformation and loss of quality.

I tried all this combinations and permutations, and many more. Simply - doesn't work.

background-repeat: no-repeat; background-position: top center; background-size: auto; background-size: cover; background-size: contain; background-size: 100% 100%;

I use Firefox 22, css is valid css3, according to W3C validator.

最满意答案

这仅适用于CSS3

background-size: 100% 100%;

UPD：对于旧的IE，您可以使用过滤器：

-ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imgpath', sizingMethod='scale')"; /* IE8 */ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imgpath', sizingMethod='scale'); /* pre IE8 */

This is for CSS3 only

background-size: 100% 100%;

UPD: For old IE you can use filters:

更多推荐