div+css怎么让背景图片自动缩放

Question

div+css怎么让背景图片自动缩放

Answer 1

.imgDiv{width:500px;height:500px;background-image:url('../images/index.jpg');-moz-background-size: 100% 100%;  -o-background-size: 100% 100%;  -webkit-background-size: 100% 100%;  background-size: 100% 100%;  -moz-border-image: url(./btn.png) 0;  background-repeat:no-repeat\9;  background-image:none\9;（此处空一行）filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/index.jpg', sizingMethod='scale')\9;}   扩展资料：css控制背景图片自动伸缩自适应的小技巧例子如下：.picLUp{    background:url(logo.png) no-repeat;    width:100%;height:40%;    background-size:100% 100%;    }    语法：filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )属性：enabled:　可选项，布尔值(Boolean)，设置或检索滤镜是否激活。true | falsetrue:　默认值，滤镜激活。false:　滤镜被禁止。sizingMethod:　可选项，字符串(String)，设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。

Answer 2

如果你不考虑低版本的浏览器，可以使用background-size: 100% 100%;这样图片就可以跟者div的变化而进行伸缩如果考虑兼容性：<div style="width: 100%; height: 300px;"> <img style="width:100%; height:100%;" src="xxx.jpg"/> </div>