Псевдоклас first-of-type

Псевдоклас first-of-type выбірае элемент, які з'яўляецца першым нашчадкам бацькі зададзенага тыпу. Гэта значыць, калі напісаць h2:first-of-type - знойдзецца першы h2 у бацьку (у адрозненне ад first-child, які знойдзе толькі той h2, які стаіць самым першым у бацьку).

Сінтаксіс

cssселектар:first-of-type {
  
}

Прыклад

Знойдзем абзац, які з'яўляецца першым абзацам у бацьку:

html<div>
  <h2>загаловак</h2>
  <p>абзац</p>
  
  <h2>загаловак</h2>
  <p>абзац</p>
  
  <h2>загаловак</h2>
  <p>абзац</p>
</div>
cssp:first-of-type {
  color: red;
}

Результат: