CSS :first-child pseudo-element

Example

How to style all elements that are the first child of its parent:

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

Try it yourself »

The :first-child pseudo-element styles the specified selector, only if it is the first child of its parent.

The :first-child selector is supported in all major browsers.

Note: For :first-child to work in IE, a <!DOCTYPE> must be declared.

The :first-child selector was first introduced in:

CSS 2

Style the first element of every parent element:

i:first-child
{
background:yellow;
}

Try it yourself »

Style all element of every element, where the element is the first child of its parent:

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

Try it yourself »

Style the first <li> element of every list:

li:first-child
{
background:yellow;
}

Try it yourself »

Style the first element of every <ul> element:

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

Try it yourself »