美文网首页
渐变-兼容IE

渐变-兼容IE

作者: Hsugar | 来源:发表于2019-05-07 17:43 被阅读0次
    • 渐变的兼容写法:
    左右:background: -webkit-linear-gradient(left, #4ba1f8, #265adc);  
        background: -moz-linear-gradient(left, #4ba1f8, #265adc);  
        background: -o-linear-gradient(left, #4ba1f8, #265adc);  
        background: -ms-linear-gradient(left, #4ba1f8, #265adc);  
        filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr=#4ba1f8, endColorstr=#265adc);
    
    上下:<br>background: -webkit-linear-gradient(top,#ffffff,#f5f5f5);
        background: -moz-linear-gradient(top,#ffffff,#f5f5f5);
        background: -webkit-gradient(linear, top, bottom,from(#ffffff),to(#f5f5f5));
        background: linear-gradient(top,#ffffff,#f5f5f5);
        background: -ms-linear-gradient(top,#ffffff,#f5f5f5);
        filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffffff, endColorstr=#f5f5f5);
    

    上面的滤镜代码主要有三个参数,依次是:startcolorstr, endcolorstr, 以及gradientType。
    其中gradientType=1代表横向渐变,gradientType=0代表纵向淅变。startcolorstr=”色彩” 代表渐变渐变起始的色彩,endcolorstr=”色彩” 代表渐变结尾的色彩。

    • IE透明度:
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /*IE6~IE8*/
    

    opacity表示透明度,默认的范围是从0 到 100,他们其实是百分比的形式。也就是说,0代表完全透明,100代表完全不透明。
    finishopacity 是一个可选参数,如果想要设置渐变的透明效果,就可以使用他们来指定结束时的透明度。范围也是0 到 100。
    style用来指定透明区域的形状特征:
    0 代表统一形状
    1 代表线形
    2 代表放射状
    3 代表矩形。
    startx 渐变透明效果开始处的 X坐标。
    starty 渐变透明效果开始处的 Y坐标。
    finishx 渐变透明效果结束处的 X坐标。
    finishy 渐变透明效果结束处的 Y坐标。

    相关文章

      网友评论

          本文标题:渐变-兼容IE

          本文链接:https://www.haomeiwen.com/subject/tbyyoqtx.html