选择子树中的所有元素

Question

如何使CSS选择器匹配标有某个类的元素的子树中的所有元素？

我正在想象下面的CSS（:subtree部分是我在做什么的。）

.diagram:subtree
{
    ...
}

当我像下面那样编写HTML时，应该选择<div>及其中的每个元素。

<div class="diagram">
    ...
</div>

Answer 1

只需使用descendant selector（空格）：

.diagram * { … }

这将选择应用了diagram类的任何元素下的每个元素。

要匹配div本身及其后代，请使用grouping：

.diagram, .diagram * { … }

引用规范：

  

有时，作者可能希望选择器匹配作为文档树中另一个元素的后代的元素（例如，“匹配H1元素包含的那些EM元素”）。后代选择器以一种模式表达这种关系。后代选择器由两个或多个由空格分隔的选择器组成。当元素B是某个祖先元素A的任意后代时，形式为“A B”的后代选择器匹配。

Answer 2

.diagram, .diagram *

这将选择div .diagram。空间是后代选择器，*是所有元素。

编辑：我认为你的问题最初是说“包括元素”因此是.diagram,，但你可以根据需要删除它。

Answer 3

只需将此代码用于.diagram * {}

即可