The **CSS child combinator (`>`)** can be used to select all elements that are the immediate children of a specified element.

> A **combinator** combines and explains the relationship between two or more [selectors](https://www.educative.io/answers/what-are-css-selectors).

# Syntax

```css
selector1 > selector2 { style properties }
```
It matches only those elements matched by the second selector (`selector2`) that are the direct children of elements matched by the first selector (`selector1`).

# Code

In this example, add a `background-color` property to all the immediate child (`p`) elements of the parent (`div`) element.

<div>
  <p>1. Immeditate child.</p>
  <p>2. Immeditate child.</p>
  <section><p>3. Not immeditate child.</p></section> 
  <p>4. Immeditate child.</p>
</div>

/* p elements that are immediate
   children of div elements */
div > p {
  background-color: plum;
}


codemirror

> Notice that the CSS property does not apply to the third `p` element as it is not an immediate child. 

What is CSS immediate child?

CSS child combinator ( > ) selects elements that are immediate children of a specified parent element.