本文摘自PHP中文网，作者青灯夜游，侵删。
css可以使用变量。在css中，变量是由CSS作者定义的实体，其中包含要在整个文档中重复使用的特定值；使用自定义属性来设置变量名，并使用var()函数来读取。
本教程操作环境：windows7系统、CSS3版、Dell G3电脑。
CSS 变量当前有两种形式：
变量，就是拥有合法标识符和合法的值。可以被使用在任意的地方。可以使用var()函数使用变量。例如：var(--example-variable)会返回--example-variable所对应的值
自定义属性。这些属性使用--*where*的特殊格式作为名字。例如--example-variable: 20px;即使一个css声明语句。意思是将20px赋值给--example-varibale变量。
在使用CSS变量的时候, 应该知道的三个主要内容
自定义属性
var()函数
:root伪类
1、自定义属性
我们可以将重复使用的属性定义成自定义属性, 这样在以后需要修改的时候, 只需要修改自定义属性里的属性值就可以了.
1 2 3 |
|
上面的代码就是自定义属性的写法, 需要注意的是, 自定义属性以 -- 开头
3、var()函数
我们需要使用var()函数来读取变量, 否则浏览器不知道你的自定义属性是啥东东.
var()函数还可以指定第二个属性, 表示属性的默认值
相关阅读 >>
更多相关阅读请进入《css》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
