用户登录

在 CSS 里面可以自定义一些变量,给变量设置一个值,然后在样式里,我们可以使用变量的名字引用它的值,修改了变量的值以后,所有使用了这个变量的样式都会发生相应的变化。

在这个网页文档的样式表里面,可以在 body 这个元素里定义一个变量,这样被这个元素包装的东西都可以使用这些变量。变量的名字要用两条横线开头,然后是给变量起的名字,比如 primary-color,这个变量的值是一个颜色值,比如 blue。

下面再用一下这个变量,用 h1 这个标签的名字作为样式的选择器,一组大括号,里面可以使用 color 这个样式属性设置一下文字的颜色,这里可以用一下在 body 元素里定义的 --primary-color 变量,引用变量,要用 var 这个函数,把要使用的变量的名字交给这个函数,比如 --primary-color。

你会发现在页面上显示的这个标题的颜色现在会是蓝色,检查一下这个标题元素,显示这个元素上面用 color 设置了一下文字的颜色,颜色的值是 --primary-color 这个变量的值,这个变量是在 body 元素里面定义的,它的值是 blue 这种颜色。

CSS 变量(Variables)《 Web 基础:样式基础 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点