css中类选择器和元素选择器联合使用分析

<html>
<head>
    <style type="text/css">
        .bb p {
            color:red;
        }

        .bb td {
            color: red;
        }
        
        p.bb {
            color: green;
        }
    </style>
</head>

<body>
css类选择器和元素选择器联合使用方法浅析:<hr>
<li>
    如果你使用的是element.class的方式来过滤元素的话,比如上面的p.bb,那么你的bb必须是在元素p里面的,而且中间是不可以有空格的。
</li>
<li>如果你使用的是class.element的方式来过滤元素的话,那么你的class必须是在此元素的父元素里面定义才行,比如.bb p,它就必须定义在可以包含的p元素的元素里面,而且它们中间是必须要有空格分割开的。
</li>

<div class="bb">
    <p>test</p>
</div>

<table class="bb">
    <tr>
        <td>dada</td>
    </tr>
</table>

<p class="bb">green</p>

</body>
</html>

你可能感兴趣的:(css,Class)