Что такое CSS-переменные (custom properties)?
- Пользовательские свойства с префиксом
--, используемые черезvar() - Наследуются по DOM-дереву, можно переопределять в дочерних элементах
- В отличие от переменных препроцессоров (Sass), работают в runtime и реагируют на изменения
:root {
--color-primary: #3b82f6;
--spacing: 1rem;
}
.button {
background: var(--color-primary);
padding: var(--spacing, 0.5rem); /* 0.5rem — fallback */
}