用css选择倒数第二个元素

Question

我已经知道了:最后一个孩子.但有没有办法选择div:

<div id="container">
 <div>a</div>
 <div>b</div>
 <div>SELECT THIS</div> <!-- THIS -->
 <div>c</div>
</div>

注意:没有jQuery,只能使用CSS

Answer 1

在CSS3中你有:

:nth-last-child(2)

请参阅:https://developer.mozilla.org/en-US/docs/Web/CSS/ : nth-last-child

nth-last-child浏览器支持:

• Chrome 2
• Firefox 3.5
• Opera 9.5,10
• Safari 3.1,4
• Internet Explorer 9

Answer 2

注意:发表这个答案是因为OP后来在评论中说明他需要选择最后两个元素,而不仅仅是倒数第二个元素.

该:nth-childCSS3选择器,其实是更有能力比你想象!

例如,这将选择最后2个元素#container:

#container :nth-last-child(-n+2) {}

但这只是美好友谊的开始.

• :nth-child 浏览器支持

#container :nth-last-child(-n+2) {
  background-color: cyan;
}

<div id="container">
 <div>a</div>
 <div>b</div>
 <div>SELECT THIS</div>
 <div>SELECT THIS</div>
</div>