zoukankan      html  css  js  c++  java
  • CSS兼容各浏览器的hack

    CSS兼容各浏览器的hack:
    建议:尽可能的手写代码,可以有效的提高学习效率和深度。
    浏览器的种类多,麻烦自然也多,主要是各种浏览器对某些属性的渲染效果并不相同,所以有时候需要专门针对特定浏览器或者特定版本书写CSS代码,这样就需要用到所谓的“CSS Hack”,下面以一段实例的形式介绍一下个浏览器hack。

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="author" content="http://www.softwhy.com/" />
    <title>蚂蚁部落</title>
    <style>
    .test{
      width: 300px;
      height: 300px;
      background: #fac;   /*各浏览器都认识,主要给高级浏览器用*/
      background: blue; /*ie10、9、8*/
      background: red9; /*所有的 ie*/
      +background: yellow; /*ie7、6 +号同*号 */
      _background:black; /*ie6*/
    }
     
    :root .test{background: blue9;} /*ie9*/
    .ie10 .test{background: #ffcccc;} /*ie10  (js 专属)*/
    </style>
    <script type="text/javascript">
      //ie 10
      if (window.matchMedia("screen and (-ms-high-contrast: active), (-ms-high-contrast: none)").matches) {
        document.documentElement.className += "ie10";
    }
    </script>
    </head>
    <body>
      <div class="test">蚂蚁部落</div>
    </body>
    </html>

    原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=3370

    更多内容:http://www.softwhy.com/shili/

  • 相关阅读:
    ado.net
    sql基础
    css样式
    HTML基础加强
    socket网络编程
    网络聊天室
    多线程
    WinForm基础
    使用Maven插件(plugin)MyBatis Generator逆向工程
    SpringBoot使用thymeleaf时候遇到无法渲染问题(404/500)
  • 原文地址:https://www.cnblogs.com/qjqcs/p/5022353.html
Copyright © 2011-2022 走看看