css自定义属性

css自定义属性

利用css自定义属性实现设置主题样式，可以将有关主题（颜色、字体大小等）指定给一个变量一次，每次使用时只需将该变量作为CSS属性输入；需要改变主题样式时也只需要修改这个变量即可

---

• 利用:root选择器定义变量

	:root {
	   --global--bgc: #f66;
	   --global--fz: 20px;
	 }

• 利用var关键字引入声明的变量

     p {
       background-color: var(--global--bgc);
       font-size: var(--global--fz);
      }
     h1 {
       background-color: var(--global--bgc);
       font-size: var(--global--fz);
     }

• 效果