Accessing global variable in CSS

Accessing global variable in CSS
0

#1
:root { --color: blue; }
div { --color: green; }
#alert { --color: red; }
<p>What's my color?</p>
<div>and me?</div>
<div id='alert'>  What's my color too?  
<p>color?</p>
</div>

In the above code how can i access the global value of --color in div with id=‘alert’?
Or in other words is there any way in CSS to access global variable like the :: (scope resolution operator) in c++ ??


#2

you can do something like this.

#alert {
color: var(--color);
}

#3

I don’t think this is possible.