Css变量

CSS

语法:

1. css变量名称语法:

1. 以--开头

2. 定义全局变量:

:root { /*根选择器*/
	--nicecolor: #1e90ff
}

3. 定义局部变量:

button {
  --blue: #0000ff; /*定义局部变量*/
  background-color: var(--white);
  color: var(--blue);
  border: 1px solid var(--blue);
  padding: 5px;
}

4. 引用变量:

h2{
	/*优先选用局部变量,齐次选用全局变量*/
	color: var(--nicecolor, 默认值)
}

1. 默认值可以省略, 用于找不到变量的时候使用
2. use::clamp, calc

5. js dom 操作css变量

child::操作css变量