CSS中的:nth-child()选择器的用法及示例代码

CSS中的:nth-child()选择器是一种用于选择HTML元素的伪类选择器。它允许您根据其在父元素中的位置选择特定的子元素。这个选择器的语法如下：

:nth-child(n)

其中，n可以是一个关键字、一个数值、一个表达式或者一个函数。让我们逐个解释这些用法：

1. 关键字用法：关键字用于选择特定位置的子元素。常用的关键字有：

   • even：选择偶数位置的子元素。
   • odd：选择奇数位置的子元素。
   • first：选择第一个子元素。
   • last：选择最后一个子元素。
   • nth-child(n)：选择第n个子元素。

   示例代码：

   /* 选择偶数位置的子元素 */
   li:nth-child(even) {
        
     background-color: lightgray