是否可以选择带有 nth-child 的最后 n 个项目?

Is it possible to select the last n items with nth-child?(是否可以选择带有 nth-child 的最后 n 个项目?)

问题描述

使用标准列表，我试图选择最后 2 个列表项.我有 An+B 的各种排列，但似乎没有选择最后 2 个:

Using a standard list, I'm trying to select the last 2 list items. I've various permutations of An+B but nothing seems to select the last 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 */

我知道像 :nth-last-child() 这样的新 CSS3 选择器，但如果可能的话，我更喜欢在更多浏览器中工作的东西(不要关心 IE特别是).

I'm aware of a new CSS3 selectors like :nth-last-child() but I'd prefer something that works in a few more browsers if possible (don't care about IE particularly).

推荐答案

这将选择列表的最后两个 iem:

This will select the last two iems of a list:

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>
</ul>

这篇关于是否可以选择带有 nth-child 的最后 n 个项目?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！