zoukankan      html  css  js  c++  java
  • ie中使用滤镜实现css3的效果

    1】圆角

    -mo-border-radius:2px;

    -webkit-border-radius:2px;

    border-radius:2px;

    2】阴影

    -mo-box-shadow:2px 2px 2px #f00;

    -webkit-box-shadow:2px 2px 2px #f00;

    box-shadow:2px 2px 2px #f00;

    fliter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=‘#f00’);

    -ms-fliter:“progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=‘#f00’);”

    3】渐变

    background-image:-mo-linear-gradient(top,#fff #f00);

    background-image:webkit-gradient(linear,top left,bottom right,color-stop(0,#fff),color-stop(1, #f00));

    fliter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff',endColorstr='#f00', GradientType='0');

    -ms-fliter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff',endColorstr='#f00', GradientType='0')";

    4】透明

    background:#f00;

    background:transparent;

    fliter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#99f00',endColorstr='#99f00');

    -ms-fliter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#99f00',endColorstr='#99f00')";

    zoom:1;

    background-color:rgba(180 180 140,0.6);

    5】字体

    @font-face {

      font-family: 'MyFont';

      src: url('myfont.eot'); /* IE6+ */

      src: local('myfont.ttf'),

      url('myfont.woff') format('woff'), /* FF3.6 */

      url('myfont.ttf') format('truetype'); /* FF3.5+, Saf3+,Chrome,Opera10+ */

    }

    6】旋转

     -moz-transform: rotate(7.5deg); /* FF3.5+ */

     -o-transform: rotate(7.5deg); /* Opera 10.5 */

     -webkit-transform: rotate(7.5deg); /* Saf3.1+, Chrome */

     filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.9914,M12=-0.1305,M21=0.1305,M22=0.9914,SizingMethod='auto expand');

     -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9914,M12=-0.1305,M21=0.1305,M22=0.9914,SizingMethod='auto expand')"; /* IE8 */

  • 相关阅读:
    定制自己的PHP语法-在PHP中实现unless
    欢迎使用CSDN-markdown编辑器
    在 Laravel 中通过 Artisan View 扩展包创建及删除应用视图文件
    直接可用的loading.js
    vue后退判断是否有历史记录,有就返回上一级,否则返回指定路由
    js防抖和节流
    IE增加Meta标签(IE=Edge,chrome=1)兼容IE问题
    如何覆盖 node_modules 里的文件
    js运行代码计时器
    vue打包font字体文件路径错误的问题处理
  • 原文地址:https://www.cnblogs.com/xiaonvziyi/p/3225429.html
Copyright © 2011-2022 走看看