CSS实现背景图自适应屏幕分辨率宽高（笔记）

很多人会问到怎么让网页的背景图片自适应屏幕高宽度，因为很多时候如果网页背景图片没有设置自适应的话，在不同分辨率的屏幕上显示的背景会有所不同，分辨率小的时候显示不全，分辨率大的时候又会留有空白，我又不想用小图片平铺满屏幕，那么该如何解决这个棘手的问题？当然用css的background-size就可以了，既简单又实用。用法举例：

body{
background:url(http://www.mizuiren.com/img/alone.png) no-repeat;
background-size:100% 100%;

} 

---

background-size的取值用法，100% 100%表示宽和高无论多少分辨率都占满屏幕，但这样有时候背景图片就会出现高宽比例不协调，那么我们可以只设置宽度，让高度自适应宽度，只要把高度值去掉就行了，如：background-size:100%;除了使用%，还可以使用固定值，固定背景图片大小，让背景图片高宽都居中显示，如：

body{
background:url(http://www.mizuiren.com/img/alone.png) no-repeat center;
background-size:100px 100px;
}
不给个演示又说我骗大家~

b

这是模块1：background-size: 100%;
这是模块2：background-size: 500px 300px;

注意：ie8及ie8以下的浏览器版本不支持，如果你还在用ie8，你该升级了~