尺寸背景图片？

我有一个200px乘200px的div。尺寸背景图片？

它的背景图像是500px x 500px。

有没有办法确保整个背景图像适合div？我知道你可以使用CSS3来设置它的大小，但我正在寻找适用于旧版浏览器的解决方案。

感谢

2013-05-04 panthro

图像已经有1纵横比：1。什么阻止你调整在Photoshop中的图像？ – Jawad 2013-05-04 17:06:45

Jawad说什么。但是，如果您确实需要动态调整图像大小并保持适当的宽高比，则可以阅读http://selbie.wordpress.com/2011/01/23/scale-crop-and-center-an-image -with-correct-aspect-ratio-in-html-and-javascript – selbie 2013-05-04 17:15:59

感谢您的链接@selbie – Jawad 2013-05-04 17:20:23

有没有一种办法，以确保整个背景图像适合股利？

该background-size property。

我知道你可以使用CSS3来调整它的大小，但我正在寻找适用于旧版浏览器的解决方案。

没有其他标准的方式来缩放背景图像。

的Internet Explorer的旧版本可以通过non-standard filter property和AlphaImageLoader支持。

/* Untested */ 
background-image: url(images/someimage.png); 
background-resize: cover; 
filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/someimage.png',sizingMethod='scale')"; 
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/someimage.png',sizingMethod='scale')";

另外，作为一个黑客，你可以使用一个<img>元素，绝对定位它后面的内容。这将是一个内容图像，所以它不会是一个干净的黑客。

来源

2013-05-04 17:10:16 Quentin

假设你的div的id等于“myid”。使用

图片作为具有500×500大小

演示：http://jsfiddle.net/abdennour/rhPDx/

div#myid{ 
    width: 200px; 
    height:200px; 

    background: url('http://px6.streetfire.net/0001/72/25/1952752_600.jpg') 
       0% 0% 
       no-repeat; 
    background-size: 200px 200px; 


}

来源

2013-05-04 17:13:14

这将*位置*图像，而不是调整它。 – Quentin 2013-05-04 17:14:16

-1

你不能调整UR在backgound图像属性的图像。

还有另一个棘手的方法来做到这一点。只需将你的背景图像放在你的div中，并添加绝对位置。 Ofc ur div需要有相对位置属性。

之后，你可以调整你的图像，只需用css2。

来源

2013-05-04 17:17:28 csizmadialj

您可以通过应用background-size:100% 100%;您div

达到同样希望这将有助于

来源

2013-05-04 17:48:25

尺寸背景图片？

回答

相关问题