为什么这个选择器没有应用于给定的标签？

Question

这个选择器不像我期望的那样工作:

<style type="text/css">
    .someClass p, b {
        color:red;
        cursor : pointer;
    } 
</style>
<p>This is a test</p>
<p>This is another <b>test</b></p>
<p class="someClass">This is a test with someClass</p>
<p>This is another <b class="someClass">test</b></p>

结果和jsFiddle: 非样式段落和样式的文本显示为黑色.pwith"someClass"类的文本没有出现在红色文本中,但是bwith class"someClass"确实显示为红色.

问题: 为什么pclass ="someClass" (第三段)没有出现红色,而bclass ="someClass" (第四段)出现红色？

这两个标记都包含在someClass选择器中.我找不到搜索的答案并没有太多运气,而且文档似乎没有解决这个问题

Answer 1

如果您希望将样式应用于b带有类的段落和元素someClass,请使用

p.someClass, b.someClass {
    color: red;
    cursor: pointer;
}

您现有的选择器目标

• 任何b元素
• 在具有该类的元素内的段落someClass.

这段代码:

.someClass p, b { something }

是相同的

.someClass p { something }
b { something }