css child

作者：终生卟离发布日期:2025-10-14 浏览:87

/* 选择器 :nth-child(n) 用于选择属于其父元素的第 n 个子元素，不论元素的类型。 */

/* 示例：选择每个 ul 元素中的第二个 li 子元素，并将其文本颜色设置为红色 */
ul li:nth-child(2) {
  color: red;
}

/* 示例：选择每个 div 元素中的第一个 p 子元素，并为其添加边框 */
div p:nth-child(1) {
  border: 1px solid black;
}

/* 示例：选择每个 section 元素中的所有奇数位置的 p 子元素，并设置背景颜色 */
section p:nth-child(odd) {
  background-color: #f0f0f0;
}

解释说明：

:nth-child(n) 是 CSS 中的一个伪类选择器，用于选择父元素下的第 n 个子元素。
n 可以是数字、关键词（如 odd 或 even）或公式（如 2n+1），具体取决于你想要选择的子元素。
在上面的示例中，我们展示了如何使用 :nth-child 来选择特定位置的子元素并应用样式。

上一篇：css 颜色代码

下一篇：css 底部阴影