CSS :first-child 伪类

定义和用法

CSS :first-child 伪类用于选择作为其父元素第一个子元素的元素(在一组兄弟元素中)。

实例

例子 1

选择并设置作为其父元素第一个子元素的每个 <p> 元素的样式:

p:first-child {
  background-color: yellow;
}

亲自试一试

例子 2

选择并设置作为其父元素第一个子元素的每个 <i> 元素的样式:

i:first-child {
  background: yellow;
}

亲自试一试

例子 3

选择并设置列表中第一个 <li> 元素的样式:

li:first-child {
  background: yellow;
}

亲自试一试

例子 4

选择并设置每个 <ul> 元素的第一个子元素的样式:

ul > :first-child {
  background: yellow;
}

亲自试一试

CSS 语法

:first-child {
  css declarations;
}

技术细节

版本: CSS3

浏览器支持

表格中的数字指定了完全支持该伪类的首个浏览器版本。

Chrome Edge Firefox Safari Opera
4.0 7.0 3.0 3.1 9.6

相关页面

CSS 教程:CSS 伪类