CSS :nth-child(n) 选择器

此选择器用于根据元素的位置进行匹配，而不管其父元素是什么类型。n 可以是关键字、公式或数字。它用于根据元素在其同级元素组中的位置进行匹配。它匹配每一个元素，该元素是第 n 个同级元素。

语法

以下是此选择器的语法

括号中的"n"是参数，代表匹配元素的模式。它可以是函数表示法、偶数或奇数。

奇数值代表位置为奇数的元素，例如 1, 3, 5 等。类似地，偶数值代表位置为偶数的元素，例如 2, 4, 6 等。

函数表示法 (An+B)：函数表示法代表其同级元素位置符合 An+B 模式的元素，其中 A 是整数步长，n 是从 0 开始的任何正整数，B 是整数偏移量。

让我们看一些示例。

示例 1

在此示例中，我们使用了函数表示法 3n+4，它将代表元素

(3×0)+4 = 4, (3×1)+4 =7，以及更多。

示例 2

在此示例中，我们将使用奇数和偶数关键字来匹配索引为奇数或偶数的元素。请注意，第一个同级元素的索引为 1。