The first-of-type pseudo-class
The first-of-type pseudo-class selects
the element that is the first child of a parent
of a given type. That is, if you write
h2:first-of-type - the first h2 in
the parent will be found (unlike
first-child,
which will find only the h2 that is
the very first in the parent).
Syntax
selector:first-of-type {
}
Example
Let's find the paragraph that is the first paragraph in the parent:
<div>
<h2>header</h2>
<p>paragraph</p>
<h2>header</h2>
<p>paragraph</p>
<h2>header</h2>
<p>paragraph</p>
</div>
p:first-of-type {
color: red;
}
: