CSS变量是在CSS3中引入的新功能，它可以帮助我们更方便地定义样式，并且可以在需要的时候进行动态更改。在本文中，我们将学习CSS变量的使用方法，主要包括变量的定义和引用。

定义变量

:root {--main-color: #3c8dbc; }

在CSS中定义变量需要使用:root选择器，此选择器表示文档根元素。然后我们可以使用--var-name的格式来定义变量，其中var-name表示变量名称。在本例中，我们定义了一个名为--main-color的变量，并给它一个蓝色的值（#3c8dbc）。

引用变量

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

引用变量也很简单，只需要使用var()函数，并传递变量名称即可。在上面的例子中，我们将--main-color的值作为body元素的背景颜色。

CSS变量可以帮助我们更好地管理和调整样式，从而让开发更加高效。希望这篇文章能对你有所帮助。