first-of-type Selector
CSS first-of-type Selector reference
The CSS first-of-type structural pseudo-class selector ( X:first-of-type ) is used to target and style the first occurence of the specified element inside of a specified parent element. It is exactly the same as using X:nth-of-type(1) with a value of "1".
CSS CODE EXAMPLE
<!DOCTYPE html>
<style type="text/css">
div p {
background-color:#B7FFBA;
}
div p:first-of-type {
background-color:#FFF1C4;
}
</style>
<div>
<h3>Heading content</h3>
<p>Paragraph content...<p>
<p>Paragraph content...<p>
<p>Paragraph content...<p>
</div>
<style type="text/css">
div p {
background-color:#B7FFBA;
}
div p:first-of-type {
background-color:#FFF1C4;
}
</style>
<div>
<h3>Heading content</h3>
<p>Paragraph content...<p>
<p>Paragraph content...<p>
<p>Paragraph content...<p>
</div>
Heading content
Paragraph content...
Paragraph content...
Paragraph content...
0 Response to "first-of-type Selector"
Post a Comment