复杂的CSS选择器有很多后代

Question

我想选择位于h3父级下的view-grouping-header和menu-publications类。请参阅以下屏幕截图：

在上图中，我想选择所有<h3>和2017或2016或2015元素。以下是CSS：

.menu-publications h3{
    background-color: red;
}
.menu-publications > .view-grouping-header{
    background-color: yellow;
}

我无法选择view-grouping-header。请参阅JS-Fiddle here。

Answer 1

正确的选择器是.menu-publications .view-grouping-header

.menu-publications h3 {
     background-color: red;
}
.menu-publications .view-grouping-header {
     background-color: yellow;
}

element > element选择器用于选择具有特定父级的元素。不直接选择的父元素不会被选中。

Answer 2

那应该是

.menu-publications .view-grouping-header{
    background-color: yellow;
}

没有> - 它不是直接的孩子