怎么在css里面定义颜色变量

html-css09

怎么在css里面定义颜色变量,第1张

有关 CSS 变量用法，举个例子：

:root{

    --height: 5rem

    --color: #64b5f6

    --circle-color: red

    --dent: 1rem

}

.left{

    width: var(--height)

    height: var(--height)

    background-color: var(--color)

    border-top-left-radius: 50%

    border-bottom-left-radius: 50%

    display: flex

}

css中的color属性是字体颜色的意思，它有两种取值方式；

第一种是关键字取值，比如：color:pink //将字体设置成粉色；

第二种是rgb格式取值，比如：color:#000000 //将字体设置成黑色；

但是关键字取值IE浏览器对某些关键字无法识别，故会出现解析不一致，所有一般推荐使用rgb取值格式。