:first-of-type

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Описание

CSS псевдокласс :first-of-type находит первого потомка своего типа среди детей родителя.

Синтаксис

css
element:first-of-type {
  /* стили */
}

Пример

Этот пример показывает, как применится универсальный селектор, если простой селектор не написан.

css
div :first-of-type {
  background-color: lime;
}
html
<div>
  <span>Это span первый!</span>
  <span>Это span нет. :(</span>
  <span>что насчёт этого <em>вложенного элемента</em>?</span>
  <strike>Это другой тег</strike>
  <span>Грустно, это тоже нет...</span>
</div>

...сработает так:

Спецификации

Specification
Selectors Level 4
# first-of-type-pseudo

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также