Псевдокласс :first-child сопоставляется элементу, который является первым дочерним элементом некоторого другого элемента.
В следующем примере селектор сопоставляется каждому элементу Р, который является первым дочерним элементом элемента DIV. Это правило запрещает отступ для первого абзаца элемента DIV:
<DIV> P:first-child { text-indent: 0 }
Данный селектор сопоставляется элементу Р внутри элемента DIV в следующем фрагменте:
<Р>Последний Р перед примечанием.
<DIV class="note">
<Р>Первый Р внутри примечания.
Однако в следующем фрагменте он не сопоставляется элементу Р, так как он второй, а первым дочерним элементом DIV является теперь тег <Н2>:
<Р>Последний Р перед примечанием. <DIV class="note">
<Н2>Примечание</Н2>
<Р>Первый Р внутри примечания.
В следующем примере устанавливается ширина шрифта bold для каждого элемента ЕМ, являющегося одним из потомков первого дочернего элемента Р:
Р:first-chiId EM { font-weight : bold }
Обратите внимание, что безымянные блоки не являются частью дерева документа,
поэтому они не учитываются при определении первого дочернего элемента. На
пример:
<Р>Это <ЕМ>жирный</ЕМ> текст.</Р>