Псевдоклассы¶

active¶

Текущий активный элемент

a:active {}

after¶

Вставка контента после элемента

p:after {
    content: "...";
}

checked¶

Выбранный флажок

input[type=checkbox]:checked {}

default¶

disabled¶

Элемент формы - отключенный

input:disabled {}

empty¶

Элемент не имеющий дочерних элементов

enabled¶

Доступный элемент

input:enabled {}

first-child¶

Поиск первого дочернего элемента

p:first-child{}

first-of-type¶

Поиск первого элемента заданного типа на том же уровне

p:first-of-type {}

focus¶

Элемент в фокусе

input:focus {}

focus-within¶

Дочерний элемент в фокусе

form:focus-within {}

hover¶

Элемент над которым находится мышка

input:hover {}

in-range¶

Элементы имеющие ограничения диапазона значений, значения которых не выходят за рамки

indeterminate¶

Элемент формы в неопределенном состоянии

input:indeterminate {}

invalid¶

Элемент формы не валидный

input:invalid {}

last-child¶

Поиск последнего дочернего элемента

p:last-child {}

last-of-type¶

Поиск последнего элемента заданного типа на том же уровне

p:last-of-type{}

lang¶

Элемент указанного языка

p:lang(en)

link¶

Не посещенная ссылка

a:link {}

not¶

Отрицание

input[type="checkbox"]:not(:checked)

input:not([type=submit]) {}

nth-child¶

Поиск заданного дочернего элемента в прямом направлении

even - все четные элементы
odd - все нечетные элементы
число - порядковый номер элемента, от 1
выражение - вида an + b

p:nth-child(2n+1){}
p:nth-child(odd){}
p:nth-child(even){}
p:nth-child(2){}

nth-last-child¶

Поиск заданного дочернего элемента в обратном напрвлении

p:nth-last-child(2) {}

nth-last-of-type¶

Поиск элементов типа на том же уровне в обратном направлений

nth-of-type¶

Поиск элементов типа на том же уровне

p:nth-of-type(2n+1) {}
p:nth-of-type(even) {}
p:nth-of-type(odd) {}

only-child¶

Единственный дочерний элемент

only-of-type¶

Единственный элемент этого типа на одном уровне

out-range¶

Элементы имеющие ограничения диапазона значений, значения которых выходят за рамки

read-only¶

Элементы только для чтения

read-write¶

Элементы которые пользователь может редактировать

required¶

Элементы форм с обязательным атрибутом

input:required {}

root¶

Корневой элемент, html

target¶

Элемент является текущей целью документа

valid¶

Валидный элемент формы

input:valid {}

visited¶

Посещенная ссылка

a:visited {}