CSS now can have VARIABLES

Question

CSS now supports variables like JavaScript does.

it store the variables in the root element and is accessed with the "var()" syntax.

The below code shows how to store "red" as the background-color of a div with name bgc...

/*css*/
html{
--bgc: red;
}

div{
background-color: var(--bgc);
}

...here "--bgc" was defined in the topmost parent element of the document(html || :root) and later accessed with the var(value) syntax on the target property.

https://code.sololearn.com/WYFh7a5Uup6i/?ref=app

Answer 1

Still experimental, so support depends of browsers/versions ( and IE should never support them, while Edge seems only -- good -- support from version 16... )

https://caniuse.com/#feat=css-variables

Anyway, documentation about that feature is available from a while...

https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables
https://developer.mozilla.org/en-US/docs/Web/CSS/--*