![如何用css设置网页字体[多图]](/aiimages/%E5%A6%82%E4%BD%95%E7%94%A8css%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E5%AD%97%E4%BD%93%5B%E5%A4%9A%E5%9B%BE%5D.png)
在css中控制插入背景图片的大小用background-size
background-size使用语法有下面四种情况
background-size: length|percentage|cover|contain
length用法：
background-size:100px； //背景图片显示的宽和高为100像素
background-size:100px 160px；//背景图片显示的宽为100像素，高为600像素
percentage用法：
background-size：60%； //背景图片的显示宽度和高度是图片大小60%；
background-size：60% 80%； // 背景图片的显示宽度是图片大小的60%，高度是80%；
cover用法：
background-size：cover； //把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。
contain用法：
background-size：contain； //把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。
扩展资料
background-size属性浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。
参考资料
百度百科——background(计算机专业术语)
用background-size属性，你想给他多大的百分比都可以，不设置表示默认图片大小，设置100%表示全屏显示图片，按比例缩小或者放大。
这样就可以实现背景图片自适应父容器大小而自动变化，达到填充效果。 但是，图片会被拉伸填充，这并不是我们想要的效果，那么我们可以不设置 100% 参数，而是使用 cover 参数。
设置cover参数以后，背景图会按比例缩放填充满整个背景。如果使用IE浏览器你会发现，上面的 background-size:100% 100% 并没有起到作用，图片原本是怎样就怎样显示，比较大就只能显示一部分。
所以这时需要使用IE特有的滤镜 AlphaImageLoader 兼容性在IE5.5+以上版本的浏览器上都可以完美运行。
1、enabled: 可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false_ true: 默认值。滤镜激活。
2、false: 滤镜被禁止。
3、sizingMethod: 可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。
4、crop: 剪切图片以适应对象尺寸。
5、image: 默认值。增大或减小对象的尺寸边界以适应图片的尺寸。
6、scale: 缩放图片以适应对象的尺寸边界。
7、src: 必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数，滤镜将不会作用。
特性:
1、Enabled: 可读写。布尔值(Boolean)。参阅 enabled 属性。
2、sizingMethod: 可读写。字符串(String)。参阅 sizingMethod 属性。
3、src: 可读写。字符串(String)。参阅 src 属性。
说明:
在对象容器边界内，在对象的背景和内容之间显示一张图片。并提供对此图片的剪切和改变尺寸的操作。如果载入的是PNG格式，则0%-100%的透明度也被提供。
PNG格式的图片的透明度不妨碍你选择文本。也就是说，你可以选择显示在PNG格式的图片完全透明区域后面的内容。这样我们就可以完美兼容绝大多数的浏览器，实现用CSS让背景图片100%填充了。
在css3中background-size 属性用来规定背景图像的大小。代版本的浏览器是不支持这个属性的。IE9+、Firefox 4+、Opera、Chrome 以及 Safari 5+ 支持 background-size 属性。
