环球科创网

2022年02月14日整理发布:css可以使用变量吗

更新时间:2022-02-15 03:56:02

导读 我们来谈谈css是否可以使用变量。相信朋友们也应该密切关注这个话题。现在我们来谈谈css是否可以为朋友使用变量。边肖还收集了css是否可以

我们来谈谈css是否可以使用变量。相信朋友们也应该密切关注这个话题。现在我们来谈谈css是否可以为朋友使用变量。边肖还收集了css是否可以使用变量的相关信息。我希望你看到后会喜欢。

Css可以使用变量。在css中,变量是由CSS作者定义的实体,其中包含要在整个文档中重用的特定值;使用自定义属性设置变量名,并使用var()函数读取变量名。

本教程操作环境:windows7系统,CSS3版本,戴尔G3电脑。

目前有两种形式的CSS变量:

变量,即具有合法的标识符和合法的值。可以在任何地方使用。您可以使用var()函数来使用变量。例如,var (-example-variable)返回对应于-example-variable的值。

自定义属性。这些属性使用特殊格式-* where *作为它们的名称。例如-example-variable : 20px;甚至是css声明语句。它的意思是将20px赋给- example-varibale变量。

在使用CSS变量时,您应该知道三件主要的事情。

自定义属性

Var()函数

:根伪类

1.自定义属性

我们可以将可重用属性定义为自定义属性,这样以后需要修改时,只需要修改自定义属性中的属性值即可。

:root {

-textcolor : # 444;

}以上代码是如何编写自定义属性的。需要注意的是,自定义属性以-开头。

3.var()函数

我们需要使用var()函数来读取变量,否则浏览器不会知道你的自定义属性是什么。

var()函数还可以指定代表属性默认值的第二个属性。

p {

color : var(-TextColor);

}要设置P标签的字体颜色,可以像上面的代码一样写。

与p { color: # 444}这是一样的。

3.根伪类

在谈论:root伪类之前,我们应该先谈谈CSS自定义属性的范围。

同一个CSS自定义属性可以在多个选择器中声明。读取时,优先级最高的属性生效。

正文{

- bgColor:红色;

}。内容{

- textColor:蓝色;

}上面的代码,-bgColor的范围是body,范围body,- textColor是。由于这个原因,最好将自定义属性放在根元素:root中,这样任何选择器都可以读取它们。

(学习视频分享:css视频教程)以上就是css是否可以使用变量的细节。更多信息请关注php中文网站其他相关文章!

来源:php中文网站

免责声明:本文由用户上传,如有侵权请联系删除!