前言:
今天工作闲暇之余,看到了一个css奇怪的写法:
:root {
--main-bg-color: red;
}
#div1 {
background-color: var(--main-bg-color);
}
经过一顿度娘查找,发现这是css3用于插入自定义属性值的函数,在多次使用同一个属性值时就非常有用了。
使用方法:
- css:用 --xxx 来定义名字,使用var()来调用该属性。
- js:写入
document.body.style.setProperty('
--main-bg-color
', '
red’);读取
document.body.style.getPropertyValue(
'--primary'
);