zoukankan      html  css  js  c++  java
  • CSS多类选择符测试

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>选择符测试</title>
    <style type="text/css">
        div{display:block;400px;height:200px;}
         #first.son{background:#ccc;}
        .second.son{border:1px solid red;}
    </style>
    </head>
    <body>
     <div id="first" class="son first">
       a
     </div>
     <div id="second"  class="son second">
       b
     </div>
    </body>
    </html>

    形如#first.son的选择符,支持性很好,ie6及以上,ff,opera,safari等浏览器都支持。
    形如.second.son的选择符,在ie6下不支持,后一个类名会覆盖前一个类名,即直接识别为.son

    其实可以利用第二条情况,作为一个针对ie6的hack来使用:
    .xxx.son{} 只要.xxx部分是一个不存在的类名。就可以屏蔽ie6之外的浏览器。只对ie6下的.son有效。
    这个hack的效果同 selector{ _property:value; } 大体一致。

  • 相关阅读:
    暑假学习
    暑假学习
    暑假学习
    暑假学习
    暑假学习
    经验教训+总结
    NT 时刻
    联赛模拟测试 17
    联赛模拟测试 16
    联赛模拟测试 15
  • 原文地址:https://www.cnblogs.com/huanlei/p/2454008.html
Copyright © 2011-2022 走看看