Pseudoclasa first-of-type

Pseudoclasa first-of-type selectează un element care este primul descendent al părintelui de tipul specificat. Adică, dacă scrieți h2:first-of-type - va fi găsit primul h2 din părinte (spre deosebire de first-child, care va găsi doar acel h2 care se află pe prima poziție în părinte).

Sintaxă

cssselector:first-of-type {
  
}

Exemplu

Să găsim paragraful care este primul paragraf în părinte:

html<div>
  <h2>titlu</h2>
  <p>paragraf</p>
  
  <h2>titlu</h2>
  <p>paragraf</p>
  
  <h2>titlu</h2>
  <p>paragraf</p>
</div>

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

Результат: