css变量

CSS 变量教程
今天才知道css也有变量~
首先认识一下:root
:root 匹配文档树的根元素，对于 HTML 来说，与 html 选择器相同。
在声明全局 CSS 变量时 :root 会很有用

:root {
//声明变量，变量名前面要加--
  --main-color: hotpink; 
  --pane-padding: 5px 42px;
}

读取变量时用var() 函数

//第二个参数，表示变量的默认值。如果该变量不存在，就会使用这个默认值。
olor: var(--main-color, #7F583F);

注意点：

• 变量值区分大小写
• 变量值只能用作属性值，不能用作属性名
• 可以在响应式布局的media命令里面声明变量，使得不同的屏幕宽度有不同的变量值