nth-child(3n+2)

`nth-child(3n 2)` 是一个 CSS 选择器，表示选中每三个元素中的第二个元素。例如，在以下 HTML 代码中，选中的元素是第二个、第五个、第八个等等的元素：

<ul>
  <li>1</li>
  <li>2</li> <!-- 选中 -->
  <li>3</li>
  <li>4</li>
  <li>5</li> <!-- 选中 -->
  <li>6</li>
  <li>7</li>
  <li>8</li> <!-- 选中 -->
  <li>9</li>
</ul>

相关问题

nth-child、nth-of-type怎么用

nth-child和nth-of-type是CSS中用于选择子元素的伪类选择器。

nth-child(selector)选择器匹配其父元素的第n个子元素，无论它的类型是什么。

nth-of-type(selector)选择器匹配其父元素中特定类型的第n个子元素。

这两个选择器都接受一个参数，可以是一个具体的数字、关键字even（偶数）或odd（奇数），也可以是一个表达式。

例如，使用nth-child(2)会选择其父元素的第二个子元素，而使用nth-of-type(3n+1)会选择其父元素中每隔3个同类型子元素的第一个。

下面是一些示例：

/* 选择第二个子元素 */
:nth-child(2) {
  /* 样式 */
}

/* 选择第三个同类型子元素 */
:nth-of-type(3) {
  /* 样式 */
}

/* 选择每隔2个同类型子元素的第一个 */
:nth-of-type(2n+1) {
  /* 样式 */
}

注意，nth-child和nth-of-type都从1开始计数，而不是从0开始。另外，如果指定的子元素不存在，则选择器将不匹配任何元素。

css3中nth-child与nth-of-type

nth-child和nth-of-type是CSS3中的伪类选择器，它们允许你根据元素在其父元素中的位置来选择元素。

nth-child选择器选取父元素中的某个特定位置的子元素。它接受一个参数n，表示选择每隔n个子元素。例如，nth-child(3n)会选择每隔3个子元素的元素。如果参数是一个常数（如2、3、4等），则会选择具有与该常数相同索引的元素。

nth-of-type选择器与nth-child类似，但只会考虑同类型的子元素。它也接受一个参数n，表示选择每隔n个同类型子元素。例如，nth-of-type(2n)会选择每隔2个相同类型的子元素。

以下是一些示例：

/* 选择第一个子元素 */
:nth-child(1) {
  /* 样式 */
}

/* 选择偶数位置的子元素 */
:nth-child(even) {
  /* 样式 */
}

/* 选择奇数位置的同类型子元素 */
:nth-of-type(odd) {
  /* 样式 */
}

/* 选择第3个、第6个、第9个等位置的同类型子元素 */
:nth-of-type(3n) {
  /* 样式 */
}

请注意，参数n是从1开始计数的，并且可以是负数。这些选择器在创建网格或布局时非常有用，可以帮助你选择特定位置的元素并应用样式。