Pseudoclasse first-of-type
A pseudoclasse first-of-type seleciona
um elemento que é o primeiro descendente
do tipo especificado no elemento pai. Ou seja, se você escrever
h2:first-of-type - será encontrado o primeiro h2 no pai
(em contraste com first-child,
que encontrará apenas o h2 que está
em primeiro lugar no elemento pai).
Sintaxe
seletor:first-of-type {
}
Exemplo
Vamos encontrar o parágrafo que é o primeiro parágrafo no elemento pai:
<div>
<h2>título</h2>
<p>parágrafo</p>
<h2>título</h2>
<p>parágrafo</p>
<h2>título</h2>
<p>parágrafo</p>
</div>
p:first-of-type {
color: red;
}
: