Выберите первый дочерний элемент из многих DIV

Question

Как я могу выбрать первый дочерний элемент в этом случае ниже:

<div class="root"> 

    <div class="child">1</div> <---- i want this element 

</div> 
<div class="root"> 

    <div class="child">2</div> 

</div> 
<div class="root"> 

    <div class="child">3</div> 

</div> 

я стараюсь ниже CSS, но я выбираю все child элементов

.child:first-child { 
    ... 
} 

Answer 1

If вы хотите, чтобы это просто повлияло на первый корень, тогда вы также добавили бы первоклассный к корню

.root:first-of-type > .child:first-of-type { 
    ... 
}