Псевдокласс :first-child

Псевдокласс :first-child позволяет стилизовать первый дочерний элемент какого-либо блока.

:first-child {
  ...   
}
  • поддерживается начиная с
  • частичная поддержка до
  • не поддерживается

Примеры

Пример работы псевдокласса first-child

В данном примере мы видим как ведет себя данный псевдокласс. Мы указали стилизацию первого p в блоке с классом .text, но если в данном блоке первым дочерним элементом будет другой тег, то стилизация p не сработает, так как он уже не является первым дочерним элементом блока .text 

Второй пример работы псевдокласса first-child

Похожий пример, только в данном случае мы говорим, чтобы стилизовался любой первый дочерний элемент блока .text

Читайте также

align-self выравнивает элемент flex/grid по поперечной оси animation-delay задержка старта анимации animation-timing-function функция расчета значений анимации background-blend-mode Способ наложения фона border-right-style стиль границы справа flex flex-grow + flex-shrink + flex-basis flex-direction задает основную ось flex контейнера float плавающий элемент grid-template-columns размеры столбцов grid сетки list-style стилизация списка order порядок flex элемента overflow-y переполнение по оси Y transition-delay задержка перед запуском перехода transition-property свойство плавного перехода word-spacing интервал между словами

Обсуждение (0)

Войдите или зарегистрируйтесь для того чтобы оставлять комментарии