background-size兼容

122 阅读 0 评论 81 点赞

我是靠谱客的博主从容水杯，最近开发中收集的这篇文章主要介绍background-size兼容，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

语法：

background-size : contain | cover | 100px 100px | 50% 100%;

参数：

background-size：contain; // 缩小图片来适应元素的尺寸（保持像素的长宽比）；
background-size ：cover; // 扩展图片来填满元素（保持像素的长宽比）；
background-size ：100px 100px; // 调整图片到指定大小；
background-size ：50% 100%; // 调整图片到指定大小，百分比相对于包含元素的尺寸。

代码

background-image: url('E:/adups/img/bg.png');

background-size: cover;

-moz-background-size: cover;

-webkit-background-size: cover;

-o-background-size: cover;

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='E:/adups/img/bg.png', sizingMethod='scale');

备注：适配IE9以下版本，url路径必须是绝对路径（filter是使用滤镜内容，IE9适配必须）