css 变量存储（自定义属性）

html：

1. 定义全局变量

:root{  // 定义全局变量

--mar-bg-color:red;

--font-size: 32px;

color: blue;

padding: 50px;

}

body{

background-color: var(--mar-bg-color);

font-size: var(--font-size);

color: var(color);

padding: var(padding);

}

2.定义局部变量

div.box{

--box-font-size: 40px;

--box-color:yellow;

}

div.box{

font-size: var(--box-font-size);

color: var(--box-color);

}

span{

color: var(--box-color);

}

3.最终效果图