first-child property CSS Reference

---

Definition and Usage

The :first-child CSS pseudo-class represents any element that is the first child element of its parent.

---

Syntax

element:first-child { style properties }

---

Examples

span:first-child {
    background-color: lime;
}

...where...

<div>
  <span>This span is limed!</span>
  <span>This span is not. :(</span>
</div>

... should look like ...
This span is limed! This span is not. :(

Example 2 - Using UL

HTML Content

<ul>
  <li>List 1</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>

CSS Content

ul li{
  color:red;
}
ul li:first-child{
  color:green;
}

---

Compatibility

Desktop browsers

Mobile browsers