css --- > 让不同的浏览器加载不同的CSS

// 通过条件注释让不同的浏览器加载不同的CSS
<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->
<!--[if IE]><!--> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6 以及 IE6以上版本可识别 <![endif]-->

描述:当一个新的CSS属性被开发出来后,由于W3C标准的申请和审核流程十分严格和漫长,浏览器厂商往往会暂时绕开这一流程
通过添加前缀的方式让自己的浏览器率先支持新的属性,以下是常见的属性前缀:

  • -webkit : Chrome、Safari等。
  • -moz : Firefox
  • -ms : IE
  • -o : Opera
// 通过浏览器的属性前缀来解决跨浏览器的兼容问题
.transform{
    -webkit-transform:rotate(-3deg);    /* 带有 Chrome、Safari 浏览器的属性前缀 */
    -moz-transform:rotate(-3deg);       /* 带有 Firefox 浏览器的属性前缀 */
    -ms-transform:rotate(-3deg);        /* 带有 IE 浏览器的属性前缀 */
    -o-transform:rotate(-3deg);         /* 带有 Opera 浏览器的属性前缀 */
    transform:rotate(-3deg);            /* W3C标准语法,无属性前缀 */
}
// ps: 一般W3C标准语法写在最后

参考《CSS高效开发实战》P16

猜你喜欢

转载自blog.csdn.net/piano9425/article/details/89052529