css中使用属性变量

图片：css3.png

使用，css3 使用完成《花朵》案例展示
其中，包含了属性变量的应用


知识点：

1、:root{}里面设置变量

:root {
     /* 设置 CSS中要用的属性变量 */
     --number: 0.7;
   }

2、使用var(变量名)引用

/* var()使用属性变量的的值 */
     transform: scale(var(--number));

3、JS通过  setProperty()修改属性变量的值

让作用当前节点的所有 CSS属性里面，使用了--number的进行修改。
cloneBox.style.setProperty("--number", n);

demo 源码：请附件下载