zoukankan      html  css  js  c++  java
  • (十三)学习CSS之两个class连一起隔空格和逗号

    1.时常见到css的这两种种写法:

    a.两个class隔空格连一起:

    .class1 .class2{......}

    b.两个class隔逗号连一起:

    .class1,.class2{......}

    2.举两个例子说明:

    两个class隔空格连一起,例A:

    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>两个class隔空格连一起</title>
        <style type="text/css">
            .classDiv {
                height: 200px;
                 200px;
                background-color: aqua;
            }
             .classDiv .classP {
                 color: hotpink;
                 background-color: #e7e7e7;
             }
        </style>
    </head>
    <body>
        <div class="classDiv">
            <p class="classP">
                .classDiv .classP对我生效
            </p>
            .classDiv .classP对我无效
        </div>
        <p class="classP">
            .classDiv .classP对我生效
        </p>
    </body>
    </html>

    例A结果:

    两个class隔逗号连一起,例B:

    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>两个class隔逗号连一起</title>
        <style type="text/css">
            .classDiv {
                height: 200px;
                 200px;
                background-color: aqua;
            }
             .classDiv .classP {
                 color: hotpink;
                 background-color: #e7e7e7;
             }
        </style>
    </head>
    <body>
        <div class="classDiv">
            <p class="classP">
                .classDiv .classP对我生效
            </p>
            .classDiv .classP对我无效
        </div>
        <p class="classP">
            .classDiv .classP对我生效
        </p>
    </body>
    </html>

    例B结果:

    3.结果说明:

    a写法只对两个class中的后者有效,前者起到过滤的作用;b写法对所有class都有效。

    .class1 .class2{......}
  • 相关阅读:
    Ldap遇到了事务管理问题
    Spring-Ldap连接Ldap及简单的增删查改
    枚举与数组的使用
    GDI_TCanvas
    获取鼠标当前位置的相对坐标、模拟鼠标点击事件
    绘制不规则图片、窗体与图形
    Message使用
    泛型_Tlist存储对象
    控件Owner和Parent的区别
    鼠标拖放
  • 原文地址:https://www.cnblogs.com/wiming/p/3956055.html
Copyright © 2011-2022 走看看