css设置背景图片自适应

Heaven helps those who help themselves
资深码农+深耕理财=财富自由
欢迎关注

css设置背景图片自适应

Created by Marydon on 2017-12-25 16:46

CreateTime--2017年12月25日16:36:07

Author:Marydon

控制背景图片100%自适应填充布局

/* 控制背景图片100%自适应填充布局 */
body{            
    background-image: url(java八种基本数据类型介绍.png);
    background-size:100% 100%;
    /* firefox 浏览器 */
    -moz-background-size:100% 100%;
    /* Safari 浏览器 */
    -webkit-background-size:100% 100%;
    /* ie8及以下有效 */
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='java八种基本数据类型介绍.png',sizingMethod='scale');             
}

说明：

　　1.Firefox，Safari，ie8及以下需要对私有属性进行特殊声明；

　　2.针对背景图片与容器的大小不一致时，需要设置的属性值也是不一样的。

详细介绍请移步至文章：background-size 和 css 滤镜之AlphaImageLoader。

与君共勉：最实用的自律是攒钱，最养眼的自律是健身，最健康的自律是早睡，最改变气质的自律是看书，最好的自律是经济独立 。

您的一个点赞，一句留言，一次打赏，就是博主创作的动力源泉！

↓↓↓↓↓↓写的不错，对你有帮助？赏博主一口饭吧↓↓↓↓↓↓