Как работает алгоритм каскадности в CSS

Каскадность в CSS определяет порядок применения стилей к элементам на основе их источников, специфичности и порядка объявления.

1. Источники стилей:
   • Браузерные стили (user agent) → Авторские стили (внешние/встроенные) → Пользовательские стили (если есть).

2. Специфичность:
   Рассчитывается по весу селекторов:

   • !important (перебивает всё)
   • Инлайн-стили (style="...") → 1000
   • ID → 100
   • Классы/псевдоклассы → 10
   • Теги/псевдоэлементы → 1

3. Порядок объявления:
   Если специфичность одинакова, побеждает последний объявленный стиль.

Пример:

.button { color: red; }  /* 10 */
#submit { color: green; }  /* 100 - приоритет */
button { color: blue; }  /* 1 */