Что означает термин 'каскад' в CSS?

Каскад в CSS определяет, какой из конфликтующих стилей должен быть применён к элементу. Он основан на трёх основных критериях:

1. Важность: Cтили с !important имеют наивысший приоритет.
2. Специфичность: Более специфичные селекторы переопределяют менее специфичные. Специфичность рассчитывается на основе количества ID, классов/псевдоклассов/селекторов атрибутов и тегов/псевдоэлементов в селекторе.
3. Порядок в исходном коде: При одинаковой важности и специфичности, применяется правило, объявленное последним.

Кроме этих трёх, учитываются и другие факторы:

• Источник стиля: Стили пользователя (в настройках браузера), стили автора (внешние и внутренние стили, инлайн-стили), стили браузера по умолчанию.
• Наследование: Некоторые свойства наследуются от родительских элементов к дочерним.

Пример специфичности:

/* Специфичность: 0-1-0 */
.my-class {
  color: blue;
}

/* Специфичность: 1-0-0 */
#my-id {
  color: red;
}

В этом случае, элемент с id my-id и классом my-class будет иметь красный цвет текста, так как ID #my-id имеет более высокую специфичность, чем .my-class.