Як псевдокласи впливають на специфічність?

CSSJunior~1 хв читання

Псевдокласи рахуються як селектори рівня класу, тому вони підвищують специфічність, додаючи +1 до колонки class у формулі специфічності.

Спрощено:

Тип селектора	Специфічність
`#id`	1,0,0
`.class`, `:hover`, `:focus`, `:nth-child()` тощо	0,1,0
`element` або `::pseudo-element`	0,0,1

Отже:

:hover, :focus, :active, :nth-child(), :not() та інші псевдокласи → підвищують специфічність, як клас
:where() - виняток, його специфічність завжди 0, навіть якщо всередині є інші селектори

Висновок: більшість псевдокласів роблять селектор сильнішим, ніби ти додав до нього клас.

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.