背景图随着容器的宽度的改变而自动调整大小,并始终完全显示

插入一幅背景图像,如何让它随浏览器自动调整大小,始终保持完全显示?

用会h5的background-size:100%,IE8-不支持,要兼容ie8-思路就是父容器relative定位,放个img加载图片,absolute定位,

<div style="background-image:url(http://avatar.csdn.net/E/8/7/2_sinat_32546159.jpg);background-size:100%;height:300px;width:300px">
    H5 CSS background-size
</div>

<div style="position:relative;height:300px;width:300px">
    兼容IE8-和所有浏览器
    <img src="http://avatar.csdn.net/E/8/7/2_sinat_32546159.jpg" style="width:100%;height:100%;z-index:-1;position:absolute;left:0;top:0"/>
</div>

样式表

html, body, #image_target {width:100%,height:100%;}
#image_target {position:absolute;top:0;left:0;}