Get variable value in css via js

Зачем в CSS переменные если их нельзя “переменять”? Да, но на самом деле можно. Существует куча разных языков программирования, но чтобы изменять значение переменных в CSS проще использовать javascript.

Why are there variables in CSS if they cannot be “changed”? Yes, but actually it is possible. There are a lot of different programming languages, but to change the value of variables in CSS it is easier to use javascript.

С помощью такого метода как setProperty присвоить переменной новое значение.

Using a method such as setProperty, assign a new value to a variable.

Example forGitHub

Таким образом можно спокойно назначить айдишник на этом месте <span id=”here-id”></span> присвоить ему через яваскрипт стиль position absolute.

This way you can safely assign an ID at this place <span id=”here-id”></span> assign it the position absolute style via JavaScript.

Способ редактировать стили на прямую через яваскрипт. Вероятно есть, стили можно переписать:

A way to edit styles directly through JavaScript. Probably there are, the styles can be rewritten:

Example developer.mozilla

function addStyle() {
const sheet = new CSSStyleSheet();
sheet.insertRule(`h1 {
background: var(--theme-color);
text-transform: uppercase;

}`);
document.adoptedStyleSheets = [sheet];
}
addStyle();

Есть вариант найти в консоли атрибут в текстовом формате стиля. Чтобы его изменить, но выводя стили в панель разработчика там так много всего что ничего не найти console.log(document.querySelector(‘head > link’))

There is an option to find the attribute in the style text format in the console. To change it, but displaying styles in the developer panel there is so much that you can’t find anything console.log(document.querySelector(‘head > link’));

Зато можно для веселости менять цвет заголовка каждую минуту с помощью одного только яваскрипта “трезвых рук” и волшебного настроения!

But for fun, you can change the color of the title every minute using only JavaScript “sober hands” and a magical mood!

https://qucu.ru/comments/