CSS实现eq(n)
Pin Young Lv9
  2014-03-19 11:51:24 2014-03-19 11:51   2023-02-05 21:25:09   119 字  1 分钟  

在某些特殊情况下，我们需要用纯CSS实现jQuery的eq(n)选择器，而CSS没有直接提供类似方法。

我们可以通过CSS的:nth-child。

1
2
3
4
5
<div>
    <div id="bar1" class="foo"></div>
    <div id="bar2" class="foo"></div>
    <div id="bar3" class="foo"></div>
</div>

.foo:nth-child(2)会选中#bar2

同时也支持奇偶操作:nth-child(odd)和偶数选择器

  • 本文标题：CSS实现eq(n)
  • 本文作者：Pin Young
  • 创建时间：2014-03-19 11:51:24
  • 本文链接：posts/de83.html
  • 版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！