css - 分组 css 选择器

Question

是否可以对两个选择器进行分组，以便仅当两个选择器都满足时才匹配一个元素？例如，如果我希望元素同时满足选择器 .a>.b~.c 和 .d~.e，是否可以编写一个选择器匹配这些选择器的交集？

Answer 1

如果您在示例中使用类选择器，则可以像这样链接类:

.a > .b.d ~ .c.e

Selects an element that has both class="c e"
which is a sibling of (i.e. comes, directly or not, after) an element that has both class="b d"
which is a child of some element of class="a"

或者，像这样，如果您希望 .c.e 出现在具有 either class b 或 d< 的元素之后:

.a > .b ~ .c.e, .a > .d ~ .c.e

Selects an element that has both class="c e"
which is a sibling of an element with either class="b" or class="d" (or both)
which is a child of some element of class="a"

这两个选择器都意味着 .b、.d 和 .c.e 都是 .a 的子级。我还应该认为它为您提供了您正在寻找的类选择器交集。