让ie8以下支持background-size的方法

    xiaoxiao2021-03-25  127

    主要是contain/cover

    1、通过滤镜的方法 

    [css] view plain copy print ? body {      backgroundurl() no-repeat center;      -webkit-background-size: cover;      -moz-background-size: cover;      -o-background-size: cover;      background-size: cover;      filter: progid: DXImageTransform.Microsoft.AlphaImageLoader( src='', sizingMethod='scale');      -ms-filter: progid: DXImageTransform.Microsoft.AlphaImageLoader( src='', sizingMethod='scale');  }   body { background: url() no-repeat center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; filter: progid: DXImageTransform.Microsoft.AlphaImageLoader( src='', sizingMethod='scale'); -ms-filter: progid: DXImageTransform.Microsoft.AlphaImageLoader( src='', sizingMethod='scale'); }

    2、通过htc文件(通过计算屏幕尺寸控制img标签尺寸,模拟background-size:cover;效果

    [css] view plain copy print ? you can use this file (https://github.com/louisremi/background-size-polyfill “background-size polyfill”) for IE8 that is really simple to use:    .selector {  background-size: cover;  -ms-behavior: url(/backgroundsize.min.htc);  }   you can use this file (https://github.com/louisremi/background-size-polyfill “background-size polyfill”) for IE8 that is really simple to use: .selector { background-size: cover; -ms-behavior: url(/backgroundsize.min.htc); }

    3、根据2的原理写js进行控制

    转载请注明原文地址: https://ju.6miu.com/read-11384.html

    最新回复(0)