在CSS中递归选择所有子元素

时间:2011-02-05 22:19:10

标签: css css-selectors

如何递归选择所有子元素?

div.dropdown, div.dropdown > * {
    color: red;
}

此类仅在定义的className和所有直接子节点上抛出一个类。你怎么能以一种简单的方式选择所有这样的childNodes:

div.dropdown, 
div.dropdown > *, 
div.dropdown > * > *, 
div.dropdown > * > * > *, 
div.dropdown > * > * > * > * {
    color: red;
}

2 个答案:

答案 0 :(得分:534)

使用空格来匹配元素的所有后代:

div.dropdown * {
    color: red;
}

x y匹配 x 中的每个元素 y ,但深层嵌套可能是 - 儿童,孙子等等。

星号*匹配任何元素。

官方规格:CSS 2.1: Chapter 5.5: Descendant Selectors

答案 1 :(得分:114)

规则如下:

A B 

B作为A的后代

A > B 

B作为A的孩子

所以

div.dropdown *

而不是

div.dropdown > *