利用jQuery和CSS将背景图片拉伸

现在WEB页面设计比较流行使用大背景图，那么您知道如何使用一张大背景图进行拉伸效果呢？也就是说使用一张固定尺寸的背景图片，让它在页面中随着浏览器尺寸进行拉伸，就像我们的电脑桌面壁纸效果。本文将带您一起使用jQuery和CSS实现背景图片拉伸效果。

将背景图片拉伸，而不是平铺，注意平铺效果我们可以使用CSS的background-repeat来实行背景图片的平铺效果，本文讨论的是背景图片的拉伸效果。这种效果在一些前卫的页面设计中已经广泛应用，尤其在一些独立页面，像登录页面使用拉伸的背景图片效果比较常见。

目前有两种解决方案可以实现背景图片拉伸效果，一种是CSS，我们可以使用background-size:cover实现图片的拉伸效果，但是IE8及以下版本不支持background-size，于是我们尝试使用微软的滤镜效果，但是IE6不支持，毕竟还有一些后进生在使用IE6。另一种解决方案是使用jQuery，完全解决浏览器的兼容性问题，还是jQuery威武。

CSS解决方案

我们准备一张背景图片，任意尺寸的，假设我们要做一个登录页面，页面中使用拉升的背景图。我们只需要在body中加入以下代码：