关于css:CSS变量在React中的应用

前言

当咱们在编写CSS文件的时候，很多的值是大量反复的，如果每次用到都应用具体的值的话，前期不批改还好，一旦波及批改，工作量会很大。

所以，实际中，为了保障可维护性，应用CSS变量成为必要。

能够将此纳入CSS的编码准则：

一个值只有呈现了不止一次，这个值就该当被定义为CSS变量。

实现

同一文件

/* 定义 */:root {    --size: 16px;}/* 应用 */div {    width: var(--size); }

不同文件

/* index.css */:root {    --systemBlue-Light: #007AFF;}

/* someComponent.module.css */@import "../../index.css";div {    color: var(--systemBlue-Light);}

不同文件间变量的调用使得在React中能够轻松实现CSS全局变量。