如何突出显示具有特定css类的最后一个html元素

Question

如果class="block"与div的数量未知，如何在以下html结构中使用class="block"突出显示最后一个div？ （在css-selectors的帮助下）

http://codepen.io/Feel_codepen/pen/Ifjzd

例如，我可以突出显示第三个div。

Answer 1

您可以使用:last-of-type

尝试此操作

div.block:last-of-type{
 color:yellow;
}

CodepenDemo

Answer 2

使用last-child：

.main .block:last-child{
    background-color:#FCC;
    /* Your styles*/
}

CodePen

Answer 3

您可以使用:last-child选择器。

可在http://css-tricks.com/almanac/selectors/l/last-child/

找到更多信息

.main .block:last-child {
  background-color: yellow;
}

http://codepen.io/anon/pen/vpqad

Answer 4

使用last-child伪类

.block:last-child{
   background-color: yellow; /* or some other color */
}

http://www.w3schools.com/cssref/sel_last-child.asp

Answer 5

试试这个

.block:last-child
{
background-color:blue;
} 

DEMO

Answer 6

魔术！

.main>div[class=block]:last-child{
  background-color:blue;
}

这应该这样做：P我希望

Answer 7

尝试使用

$("div:last-child").addClass("last-child");

使用此功能，您可以将css类添加到某个div或元素的最后一个子元素