css如何获取第几个元素？

css如何获取第几个元素？下面本篇文章就来给大家介绍一下使用CSS获取第几个元素的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

1、:first-child选择器

:first-child匹配第一个子元素。例如：

li:first-child{background:#fff}

2、:last-child选择器

:last-child用来匹配父元素中最后一个子元素，例如：

li:last-child{background:#fff}

3、:nth-child(n) 选择器

:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。该选择器匹配父元素中的第n个子元素。

n 可以是数字、关键词或公式。

nth-child(3)
表示选择列表中的第3个标签，例如：li:nth-child(3){background:#fff}，代码中的3也可以改成其它数字，如4、5等。想选择第几个标签，就填写几。
nth-child(2n)
这个表示选择列表中的偶数标签，即选择第2、第4、第6…… 标签，例如：li:nth-child(2n){background:#fff}
nth-child(2n-1)
这个表示选择列表中的奇数标签，即选择第1、第3、第5、第7……标签，例如：li:nth-child(2n-1){background:#fff}
nth-child(n+3)
这个表示选择列表中的标签从第3个开始到最后。
nth-child(-n+3)
这个表示选择列表中的标签从0到3，即小于3的标签。

4、:nth-last-child(n) 选择器

:nth-last-of-type(n)选择器匹配同类型中的倒数第n个同级兄弟元素。参数是元素的索引。索引从1开始。

n 可以是数字、关键词或公式。