ShuBlog

Как считать специфичность CSS

Наследование и специфичность решают разные задачи. Цвет текста может перейти к дочернему элементу от родителя. Но если собственное правило задаёт цвет этому элементу, унаследованное значение уступает ему.

Сравниваем два селектора

.note a { color: navy; }
article a { color: teal; }

Если оба правила из одного слоя каскада применяются к одной ссылке и имеют одинаковую важность, первое победит: в нём есть класс. При равной специфичности в таком же контексте выигрывает правило, записанное позднее.

Где искать причину

В инспекторе браузера выберите элемент и найдите зачёркнутое свойство. Сначала проверьте, применяется ли правило к самому элементу, затем сравните слой и специфичность. Такой порядок обычно быстрее, чем добавление нового !important.