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

时间:2013-02-04 15:56:27

标签: css css-selectors

此选择器无法正常工作:

<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 非样式段落和样式的文本显示为黑色。 带有“someClass”类的p的文本不会显示为红色文本,但带有“someClass”类的b确实显示为红色。

问题: 为什么p class =“someClass”(第三段)不显示为红色,而b class =“someClass”(第四段)出现红色?

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

1 个答案:

答案 0 :(得分:5)

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

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

您现有的选择器目标

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

此代码:

.someClass p, b { something }

相同
.someClass p { something }
b { something }