是否有可能select最后的n个项目与第n孩子？

使用标准列表，我试图select最后2个列表项。 我有An+B各种排列，但似乎没有select最后2：

 li:nth-child(n+2) {} /* selects from the second onwards */ li:nth-child(n-2) {} /* selects everything */ li:nth-child(-n+2) {} /* selects first two only */ li:nth-child(-n-2) {} /* selects nothing */ 

我知道一个新的CSS3select器，如:nth-last-child()但我更喜欢在可能的情况下在更多的浏览器中工作的东西（尤其不关心IE）。

Answer 1

nth-last-child听起来像是专门devise来解决这个问题，所以我怀疑是否有一个更兼容的select。 不过支持看起来相当不错 。

Answer 2

这将select列表的最后两个iems：

 li:nth-last-child(-n+2) {color:red;} 

 <ul> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> <li>fred</li> </ul> 

Answer 3

:nth-last-child(-n+2)应该做的伎俩

Answer 4

由于对nth-child的语义的定义，我不明白如果不包括所涉及的元素列表的长度，这是如何可能的。 语义的要点是允许将一堆子元素分隔成重复的组（ 编辑 – 感谢BoltClock），或者分成一些固定长度的第一部分，然后是“其余部分”。 你想要的是相反的东西，这是nth-last-child给你的东西。

Answer 5

如果你在你的项目中使用jQuery，或者愿意包含它，你可以通过它的select器API调用nth-last-child （这是模拟它将跨越浏览器）。 这里是一个到nth-last-child插件的链接 。 如果您采用这种定位您感兴趣的元素的方法：

 $('ul li:nth-last-child(1)').addClass('last'); 

然后重新deviselastclass级，而不是nth-child或nth-last-child伪select器，您将拥有更一致的跨浏览器体验。