变量是CSS预处理器存在的主要原因之一。为某样东西设置变量的能力，比如颜色，在CSS中让变量保持一致，可DRY，并且易于改变是很有用的。出于相同原因，也可以使用原生CSS变量（“CSS自定义属性”）。但有一些重要的差异应该清楚。
我将从这里说起: 在W3C标准规范中，使用CSS变量并没有任何条件。我认为这是规范文档中的一个很大的缺陷，CSS变量已经实现了很多我们之前无法实现的功能，并且我们未来可能大量使用，缺失文档描述着实让人沮丧。但是如果现在我们需要这些对CSS变量的描述怎么办？好，借助其他的CSS知识，我们可以在一些实例中略窥一二。
今天要聊的网格系统不是CSS Grid Layout，而要聊的是类似960gs。到止前为止类似于960gs的网格系统成熟的系统有很多套了。
我本来觉得应该从介绍CSS中引入变量的用途开始讲起，但事实上，很多流行的CSS预处理/后处理程序已经做了很好的诠释。当然，手动地去搜索或者查找/替换依然能满足你的需求，但这就像是不在JS中使用变量一样--很痛苦。事实上，CSS变量的动态性和作用域能够为你的实践和应用提供更加强大的能力--你可以非常高效的读取、设置和更新这些变量！同时，就像Webkit的小伙伴们在审查工具中做的那样，你也可以避免在你的代码中出现重复的代码片段（冗余）。
