What is first child in CSS?

The first-child is a pseudo class in CSS that represents the first element in a group of sibling elements.

Using the first-child pseudo class, we can select the first child of a parent element.

CSS Syntax #

:first-child {
 // css here
}

Suppose you have one ol element and four li elements. Now you want to style the very first li element. You can easily select the first li element using the first-child pseudo class.

<style>
  li:first-child {
    background-color:blue ;
    color:red;
    padding:5px ;
  }
</style>
<ol>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ol>