CSS Custom Properties

by tjcrowder

HTML

<div class="container">
    <div id="one" class="one">one</div>
    <div id="two" class="two">two</div>
</div>
<div>
    <a href="#one">one</a>
    <a href="#two">two</a>
</div>

CSS

.container {
    --color: gray;
}

.container > div {
    color: var(--color);
}

.container > div:target {
    --color: blue;
}