CSS3自定义属性

CSS3自定义属性是一种定义在 :root 参照根元素上的属性，可以被所有后代元素所继承和使用

自定义属性可以用 -- 作为前缀来定义，如：--primary-color: #ff0000

定义自定义属性后，可以在任何CSS规则内使用var()函数来引用自定义属性的值

示例：

定义一个自定义属性：

:root {
  --primary-color: #ff0000;
}

使用自定义属性：

body {
  background-color: var(--primary-color);
}

在上述代码中，我们定义了一个名为 --primary-color 的自定义属性，并将其值设置为红色。在 body 元素的CSS规则中，我们使用 var() 函数来引用这个自定义属性，并将其值设置为 background-color 的值，这样 body 的背景色会使用 --primary-color 自定义属性的值，即红色

使用自定义属性的好处是代码的可重用性和构建更易于维护的样式库，可以使开发者在整个网站中更容易地应用相同的样式属性