nth-child 偶数和奇数怎么选

nth-child 是 CSS 中的伪类选择器，用于选取某个元素的特定位置。

要选择偶数元素，可以使用 `:nth-child(even)` 伪类选择器。例如：

ul li:nth-child(even) {
  /* 样式 */
}

上述代码将选中 `<ul>` 元素下的偶数位置的 `<li>` 元素，并可以对其应用特定的样式。

同样地，要选择奇数元素，可以使用 `:nth-child(odd)` 伪类选择器。例如：

ul li:nth-child(odd) {
  /* 样式 */
}

这段代码将选中 `<ul>` 元素下的奇数位置的 `<li>` 元素，并对其应用特定的样式。

请注意，`:nth-child` 的计数是从 1 开始的，而不是从 0 开始。

相关问题

nth-of-type和nth-child区别

nth-of-type和nth-child是CSS中用来选择特定元素的伪类选择器。

nth-of-type选择器用于选择同类型元素中的特定位置的元素。它的语法是`:nth-of-type(n)`，其中n可以是一个具体的数字、关键字even（偶数）、odd（奇数）或表达式an+b。例如，`:nth-of-type(3)`会选择同类型元素中的第三个元素。

而nth-child选择器用于选择父元素下的所有子元素中的特定位置的元素，无论其类型如何。它的语法也是`:nth-child(n)`，具体使用方式与nth-of-type相同。例如，`:nth-child(3)`会选择父元素下的第三个子元素。

区别在于，nth-of-type只会选择同类型元素中的特定位置的元素，而nth-child会选择父元素下的所有子元素中的特定位置的元素，无论其类型如何。因此，在某些情况下，它们可能会选择不同的元素。

nth-child和not

nth-child 和 not 都是 CSS 选择器中的两个常用伪类。

:nth-child() 选择器用于选取元素的某个特定序号的子元素。它的语法是 ":nth-child(n)"，其中 n 是一个正整数、关键字（如 even 偶数、odd 奇数）或公式（如 2n+1）。具体来说，它会选择父元素的所有子元素中满足给定规则的那些元素。

:not() 选择器用于选取不满足指定条件的元素。它的语法是 ":not(selector)"，其中 selector 是要排除的选择器表达式。换句话说，它会选择不匹配指定选择器的元素。

举个例子来说，假设有一个 HTML 结构如下：

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
</ul>

我们可以使用 nth-child 和 not 来选择特定的子元素，比如：

/* 选择第二个子元素 */
li:nth-child(2) {
  color: red;
}

/* 排除第三个子元素 */
li:not(:nth-child(3)) {
  background-color: yellow;
}

上述代码中，第二个 li 元素会被设置为红色，而排除了第三个 li 元素的所有其他 li 元素会有黄色背景。

希望这个例子能帮助你理解 nth-child 和 not 选择器的用法。如果还有其他问题，请随时提问。