Las*_*ert 8 css css-selectors css3
在CSS中,是否可以递归选择all:last-child from body？
鉴于此标记:
<body>
<div id="_1">
<div id="_2"></div>
</div>
<div id="_3">
<div id="_4">
<div id="_5"></div>
<div id="_6"></div>
</div>
</div>
</body>
我正在寻找div no.3,4和6
另一种说法是:
body > :last-child,
body > :last-child > :last-child,
body > :last-child > :last-child > :last-child,
body > :last-child > :last-child > :last-child > :last-child {
/* My stuff here */
}
但显然这不是一个好方法.
不,不幸的是,这只是在不修改HTML的情况下实现它的唯一方法.
已经有至少一个请求为递归版本:first-child和:last-child伪类,但它似乎并没有获得了大量支持.请注意,它建议以与问题相同的方式嵌套和重复伪类:
目前,AFAIK,我们只能将儿童匹配到预先知道的一些确切的嵌套级别(下例中为3):
Run Code Online (Sandbox Code Playgroud).container > :first-child, .container > :first-child > :first-child, .container > :first-child > :first-child > :first-child {}我们不能只使用:first-child上下文选择器,因为它也会选择不是第一个孩子的块的第一个子节点.
所以我们需要一种递归选择器,它不仅匹配最后一个子的第一个,而且递归匹配所有最前面和最后一个元素,而不管它们的嵌套级别如何.