在网站建设中。一般情况下,我们会自定义几个色调,主要为网站的主体配色,但是在写CSS的过程中,多处需要进入设置颜色,但是色值若是记不清,每次都得去查询,比较麻烦。
下面介绍一种简单的方式。
首先,我们定义一些我们常用的颜色 :
:root {
--colorred: #C54B4D;
--colorblue:#1889DF;
--coloryellow: #FB9614;
}这里我们定义了红色,蓝色,黄色三种颜色 。
在之后的CSS中我们就可以直接调用这些颜色了。
比如说:
a {
color: var(--colorred); /* 链接文字颜色使用 --colorred */
}
a:hover {
color: var(--colorblue); /* 鼠标悬停时变蓝色 */
}比如说:
.main{
backgruond:var(--colorred);
}这样是不是很方便?