CSS :first-child Selector

Select and style every <p> element that is the first child of its parent:

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

More "Try it Yourself" examples below.

Definition and Usage

The :first-child selector is used to select the specified selector, only if it is the first child of its parent.

Version:	CSS2

The numbers in the table specifies the first browser version that fully supports the selector.

Selector
:first-child	4.0	7.0	3.0	3.1	9.6

:first-child {
css declarations;
} Demo

Select and style every <i> element of every <p> element, where the <p> element is the first child of its parent:

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

Select and style the first <li> element in lists:

li:first-child {
background: yellow;
}

Select and style the first child element of every <ul> element:

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