Чтобы создать переменную в CSS, нужно использовать функцию var(). Это выглядит примерно так:
:root {
--primary-color: #ff0000;
}
h1 {
color: var(--primary-color);
}
В этом примере мы создаем переменную —primary-color в корневом селекторе :root и устанавливаем ее значение в красный цвет. Далее мы используем эту переменную в стиле заголовка h1, задавая ему цвет переменной с помощью функции var().
Обратите внимание на синтаксис создания переменной: имя переменной начинается с двух дефисов (—), за которыми следует имя переменной. Далее идет двоеточие и значение переменной. Мы можем использовать это значение позже в CSS, обернув его в функцию var().
Также важно отметить, что переменные в CSS работают только в том блоке стилей, в котором они определены. Если вы хотите использовать переменную в другом блоке стилей, вам нужно определить ее там же.