《六》CSS 中的自定义属性

自定义属性：也可以称作 CSS 变量或者级联变量，是由 CSS 作者定义的。由自定义属性标记来设定值（例如： --main-color: black;），由 var() 函数来获取值（例如： color: var(--main-color);）它包含的值在整个 CSS 文档中都可以重复使用。

自定义属性会继承。

基本用法：

1. 声明一个自定义属性，需要写在规则集之内，属性名需要以两个减号 --开始，属性值可以是任何有效的 CSS 值。

   规则集指定的选择器定义了自定义属性的作用域。最佳实践是定义在根伪类 :root 下，这样就可以在 HTML 文档的任何地方访问到它了。

   :root {
     --main-bg-color: brown;
   }
   

2. 使用时用 var() 函数包裹自定义的属性名。

   .container {
   	background-color: var(--main-bg-color);
   }