Question

在下面的代码中，我想专门为最后一个“B”的内容添加样式。

<div class="A">
  <div>
   I am <span class="B">foo</span>.
  </div>
  <div>
   I like <span class="B">bars</span>.
  </div>
  <div>
   Actually, call me <span class="B">FOOBAR</span>.
  </div>
</div>

我一直在尝试

.B:last-of-type { color: red; }

并且所有类“B”都被选中，因为它使用了它的直接父元素元素中的最后一个出现。即在它的直接兄弟姐妹中

有没有办法只选择整个文件中“B”的最后一次出现？

Answer 1

试试这个JsFiddle Demo

.A div:last-child .B{ color: red; }

Answer 2

你可以这样做

.A div:last-of-type .B { color: red; }

Fiddle Demo

或

.A div:last-child .B { color: red; }

Fiddle Demo

Answer 3

找到答案！ CSS3 get last element

我正在做这个版本，但我发现它很丑，我想这是唯一的方法。我将保持这个问题的开放，看看是否有人有更好的建议。

Answer 4

.A span.B:last-child
{
background:#999;
}

Answer 5

.A div:last-child .B:last-child
{
background:orange;
}

CSS样式文档中的最后一个元素

5 个答案: