css图像背景会自动调整大小

| 我试图将图像嵌入到iframe中，但不确定其大小。我尝试如下，但似乎无法正常工作。请让我知道如何进行。我真正想做的是，图像应自动适合页面。图像小于页面，因此，当我删除不重复时，在屏幕上可见多个图像实例。请帮忙谢谢。

 body{
            background-image:url(someimageurl);
            width:1400px;
            height:1600px;
            background-repeat:no-repeat;

        }

已邀请:

3 个回复

委婪绷冗诉

罗丹走在正确的轨道上。在纯CSS中，您只能在CSS3中使用它，并且只有最新版本的浏览器才能正常工作。但是，您可以通过将绝对定位的图像放在页面的一角，将宽度和高度设置为100％来伪造它。然后，一些z-index工作将内容放在图像上方。 HTML：

<img class=\"background\" />
<div class=\"wrapper\">
content goes here
</div>

CSS：

img.background{position:fixed;top:0;left:0;width:100%;height:100%;z-index}
div.wrapper{position:relative;z-index:1;}

在这里查看-http://jsfiddle.net/snkg8/ 仅供参考-如果没有一些额外的CSS hack，这将无法在IE6中使用，但是我不再理会IE6。

糖固傻染

您有一个CSS属性作为背景尺寸：

background-size: 100%;

不幸的是，它是CSS3属性，仅在最新的浏览器（IE9，Firefox4）中受支持。

扦帽次杏

通过使用css3，

html { 
background: url(bg.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

这适用于所有浏览器和ie9 +。以下过滤器也可以在ie7和ie8中使用。

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

要回复问题请先登录或注册

css图像背景会自动调整大小

3 个回复

发起人

image

css

问题状态

css图像背景会自动调整大小

与内容相关的链接

3 个回复

发起人

image

css

问题状态