关于实现页面以一张图片为背景，且背景不变形的效果

主要是实现类似百度首页的皮肤，改变浏览器窗口大小，图片按照比例缩放，不变形的效果。

1. html部分

<!-- 背景图片-begin -->

<div class="login-bg">

<img src="images/bg.png" id="login_bg" />

</div>

<!-- 背景图片-end -->

<!-- 用空白的图片来挡住大图片-begin -->

<div class="login-bg-blank"></div>

<!-- 用空白的图片来挡住大图片-end -->

2. css的部分

.login-bg {

　　 position:absolute;

　　top:0px;

　　left:0px;

　　margin:0px auto;

　　overflow:hidden;

　　z-index:-2;

　　width:100%;

　　height:100%;

}

.login-bg img {

　　width: 100%;

}

.login-bg-blank {

　　position:absolute;

　　top:0px;

　　left:0px;

　　overflow:hidden;

　　margin:0px auto;

　　width:100%;

　　height:100%;

　　background:url("../images/blank.gif");

}

3. js的部分

// 改变背景图片的宽高比

function resizeImg() {

// 该图片的宽高比

var scale = 1280 / 800;

var w = $(window).width(),

h = $(window).height();

if(w / h > scale){

$("#login_bg").css({width: ‘100%‘, height: ‘auto‘});

} else {

$("#login_bg").css({width: ‘auto‘, height: ‘100%‘});

}

};