使用CSS的var()函数 快速修改页面样式 自定义属性前加两个--

好处是只需要修改一个地方就可以改变多处样式。可以用来快速更改布局，调整页面颜色，相当于为CSS增加了一个批量替换的功能。
例：自定义一个bgcolor:red的属性，通过修改自定义属性让test1、test3、test5快速改变颜色。

<style>
:root {
  --bgcolor:red;
}
div{width:100px;height:100px;background:green}
div.test1,div.test3,div.test5{background:var(--bgcolor)}
</style>
<div class="test1"></div>
<div class="test2"></div>
<div class="test3"></div>
<div class="test4"></div>
<div class="test5"></div>