Question

我有一堆带有B级的div跟在一个带有A类的div之后：

<div class="B"></div>
<div class="A"></div>
<div class="A"></div>
<div class="A"></div>

<div class="B"></div>
<div class="A"></div>

我试图在每个B之后将CSS规则应用到最后一个A.我尝试了

.B ~ .A:last-of-type

但那并没有奏效。这可能吗？

Answer 1

目前您无法使用css执行此操作。 :last-of-type伪类适用于span div等元素类型 - 而不是类

那样：

1）目前没有兄弟选择器

2）您无法更改标记的结构和

3）你事先不知道你有多少。每个人都有一个div .B div ......

...你好运，CSS目前无法做到这一点。

Answer 2

在这种情况下，您可以使用:last-of-type选择器。

.A:last-of-type {
/*apply styling */
}

在您的情况下，我建议您将它们分组为div。 http://jsfiddle.net/GtLWJ/ 这很有效。

 <div class="sec1">
<div class="head">Set</div>
<div class="sub">Item 1</div>
<div class="sub">Item 2</div>
<div class="sub">Item 3</div>
</div>
<div  class="sec1">
<div class="head">Set</div>
<div class="sub">Item 1</div>
</div>

CSS：

    .head {
    font-weight: 800;
}

.sec1 .sub:last-of-type {
    border-bottom: 1px solid #000;
}

选择最后一般的兄弟姐妹

2 个答案: