Question

好的，所以我在用css选择最后一个孩子的最后一个孩子时遇到了一些麻烦。

我的样本是：

<div class="X">
    <div class= "A">
        <div class="B"></div>
        <div class="C"></div>
        <div class="D"></div>
    </div>
    <div class= "A">
        <div class="B"></div>
        <div class="C"></div>
        <div class="D"></div>
    </div>
    <div class= "A">
        <div class="B"></div>
        <div class="C"></div>
        <div class="D"></div>  <!-- This is the one I want to select -->
    </div>
</div>

我一直在玩，试图只选择最后一个带有“D”类的div而不能。我觉得我只是想错过一些简单的东西。

最终目标是不显示它，但我总是最终要么不显示任何“D”元素，要么不显示最后一个“A”元素。

有人可以告诉我该怎么做吗？'

编辑：我忘记了顶级元素。添加了X div以准确说明我的内容。

Answer 1

你可以这样做：

.A:last-child div:last-child {
    //rules
}

Answer 2

尝试：

.A:last-child div:last-child {

see fiddle

Answer 3

使用此选择器：

div.A:last-child div.D { ... }

Fiddle

选择最后一个孩子的最后一个孩子

3 个答案: