用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

n-last-child 浏览器支持：

  

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

Answer 2

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

---

:nth-child CSS3选择器实际上比你想象的更强大！

例如，这将选择#container的最后2个元素：

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

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

• :nth-child Browser Support

#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>