HTML5技术

各大浏览器hack - jerrylsxu

字号+ 作者:H5之家 来源:博客园 2016-01-14 13:18 我要评论( )

IE6 : "*"_下划线格 :myclass {_background:red;} "*"星号:格式:.myclass{*background:red;} IE7 : "*星号格式:.myclass{*background:red;} *+html 格式: *+html .myclass{background:red;} + 格式: .myclass{+background: red;} !important 格式: .my

IE6  : " *"_“下划线格 :myclass  {_background:red;}

"*"星号:格式:.myclass{*background:red;}

IE7 : " * “星号格式:.myclass{*background:red;}

           *+html  格式: *+html .myclass{background:red;}

             + 格式: .myclass{+background: red;}

           !important  格式: .myclass{background:red !important;}

IE8 : \0 格式:.myclass{background:red\0;}/*是留给ie8的,最新版opera也认识,后面自有hack写了给opera认的,所以,\0我们就认为是给ie8留的;*/

IE9 :  \9\0 è格式:.myclass{background:red\9\0;}

            :root加\9 è格式::root .myclass{background:red\9;}

IE10 :  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 

   /* IE10-specific styles go here */ }

Firefox : @-moz-document url-prefix() { .font1 {color:red} } /*针对Firefox浏览器的写法*/

Opera :@media all and (min-width:0px){ #test {background-color:black\0;} } 这个是老是跟ie抢着认\0的神奇的opera,必须加个\0,不然firefox,chrome,safari也都认识。。。

chrome/Safari : @media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }最后这个是浏览器新贵chrome和safari的。

总结:         1、IE6、IE7都支持 *,但IE8终于回归正统,放弃了对*的支持

                  2、IE7、IE8、Firefox、Opera、Safari都支持!important

                  3、浏览器优先级别:FF<IE7<IE6,CSS hack,遵循书写顺序一般为FF IE7 IE6

                  4、 ie9的hack目前ie10也适合

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 浏览器渲染原理及流程 - 李某龙

    浏览器渲染原理及流程 - 李某龙

    2017-04-13 12:01

  • 认识浏览器缓存 - TechSnail

    认识浏览器缓存 - TechSnail

    2017-04-03 09:02

  • H5安卓端浏览器如何去除select的边框? - yangzailu1990

    H5安卓端浏览器如何去除select的边框? - yangzailu1990

    2017-03-08 17:02

  • 详解Google Chrome浏览器(操作篇) - Alan_beijing

    详解Google Chrome浏览器(操作篇) - Alan_beijing

    2017-02-13 15:01

网友点评
u