• css3.0新属性效果在ie下的解决方案(兼容性)


    css3.0增加的新属性,如投影、渐变、旋转、圆角等等!这些新标准属性在ie6、ie7、ie8浏览器版本里得不到很好的支持,相信ie以后的新版本也会支持这些新属性的。目前ie6、ie7、ie8浏览器不支持这些属性并不能说明ie就实现不了css3.0新属性的效果!我们收集整理了一些css3.0新属性效果在ie下的解决方案!

    .box_round {
    -moz-border-radius: 12px; /* FF1+ */
    -webkit-border-radius: 12px; /* Saf3+, Chrome */
    border-radius: 12px; /* Opera 10.5, IE 9 */
    }

    .box_shadow {
    -moz-box-shadow: 0px 0px 4px #fff; /* FF3.5+ */
    -webkit-box-shadow: 0px 0px 4px #fff; /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 4px #fff; /* Opera 10.5, IE 9.0 */
    }

    .box_gradient {
    background-image: -moz-linear-gradient(top, #444, #999); /* FF3.6 */
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #444),color-stop(1, #999)); /* Saf4+, Chrome */
    filter: progidXImageTransform.Microsoft.gradient(startColorStr='#444, EndColorStr='#999); /* IE6,IE7 */
    -ms-filter: "progidXImageTransform.Microsoft.gradient(startColorStr='#444, EndColorStr='#999)"; /* IE8 */
    }

    .box_rgba {
    background-color: #B4B490; background-color: rgba(180, 180, 144, 0.6); /* FF3+, Saf3+, Opera 10.10+, Chrome */
    filter: progidXImageTransform.Microsoft.gradient(startColorStr='#99B4B490',EndColorStr='#99B4B490'); /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#99B4B490',EndColorStr='#99B4B490')"; /* IE8 */
    }

    .box_rotate { -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(sizingMethod='auto expand', M11=0.9914448613738104, M12=-0.13052619222005157, M21=0.13052619222005157, M22=0.9914448613738104); /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.9914448613738104, M12=-0.13052619222005157, M21=0.13052619222005157, M22=0.9914448613738104)"; /* IE8 */
    zoom: 1;
    }

    .box_transition {
    -moz-transition: all 0.3s ease-out; /* FF3.7+ */
    -o-transition: all 0.3s ease-out; /* Opera 10.5 */
    -webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
    }

    /* */@font-face {
    font-family: 'WebFont'; src: url('myfont.eot'); /* IE6+ */
    src: local('?'), url('myfont.woff') format('woff'), /* FF3.6 */
    url('myfont.ttf') format('truetype'); /* Saf3+,Chrome,FF3.5,Opera10+ */
    }

    佛为心,道为骨,儒为表,大度看世界; 技在手,能在身,思在脑,从容过生活; 三千年读史,不外功名利禄; 九万里悟道,终归诗酒田园;
  • 相关阅读:
    微信小程序右上角胶囊的位置
    NLP复习大纲
    网站收藏
    css中如何调整插入背景图片的大小
    禁止Power Apps Canvas用户通过SharePoint Online UI界面访问站点list
    c++ vector基本知识
    c++ map基本知识
    c++ string操作
    python学习笔记30:操作excel
    c++, 如何run一个c++程序
  • 原文地址:https://www.cnblogs.com/taofx/p/4139320.html
Copyright © 2020-2023  润新知