พีซูโดคลาส first-of-type

พีซูโดคลาส first-of-type เลือก องค์ประกอบที่ซึ่งเป็นลูกตัวแรก ของประเภทที่กำหนดในผู้ปกครอง นั่นคือ ถ้าเขียน h2:first-of-type - จะเจอ h2 ตัวแรกในผู้ปกครอง (ต่างจาก first-child, ซึ่งจะเจอเฉพาะ h2 ที่อยู่ เป็นลำดับแรกสุดในผู้ปกครอง)

ไวยากรณ์

selector:first-of-type {
	
}

ตัวอย่าง

มาหาย่อหน้าที่ซึ่งเป็นย่อหน้าแรก ในผู้ปกครอง:

<div>
	<h2>หัวข้อ</h2>
	<p>ย่อหน้า</p>
	
	<h2>หัวข้อ</h2>
	<p>ย่อหน้า</p>
	
	<h2>หัวข้อ</h2>
	<p>ย่อหน้า</p>
</div>

p:first-of-type {
	color: red;
}