css如何使用变量？

CSS 变量是由CSS作者定义的实体，其中包含要在整个文档中重复使用的特定值。使用自定义属性来设置变量名，并使用特定的 var() 来访问。

CSS 变量当前有两种形式：

• 变量，就是拥有合法标识符和合法的值。可以被使用在任意的地方。可以使用var()函数使用变量。例如：var(--example-variable)会返回--example-variable所对应的值

• 自定义属性。这些属性使用--*where*的特殊格式作为名字。例如--example-variable: 20px;即使一个css声明语句。意思是将20px赋值给--example-varibale变量。

css中使用变量的方法：

声明变量时，变量名前要加两根连词线（--）。

示例：

声明一个局部变量：

element {
  --main-bg-color: brown;
 }

使用一个局部变量：

element {  
background-color: var(--main-bg-color);
}

声明一个 全局 CSS 变量：

:root {
  --global-color: #666;
  --pane-padding: 5px 42px;
}

使用一个 全局 CSS 变量：

.demo{
   color: var(--global-color);
}

以上就是css如何使用变量？的详细内容，更多请关注易知道|edz.cc其它相关文章！