CSS 变量数组 - 可能吗？答案

【问题标题】：CSS Variable arrays - possible?CSS 变量数组 - 可能吗？
【发布时间】：2017-03-09 15:19:53
【问题描述】：

我了解如何在 CSS 中使用变量。他们帮助我加快了客户网站的工作流程。

我注意到有好几次我会在变量旁边写下带有数字的变量，以分配给特定的颜色或外观，因为没有适当的数组系统。可以这么说，我最终创建了一个准数组。

这样

--c1: color:#ddd;  //link color
--c2: color:#aaa;  //quote color
--c3: color:#444;  //body text

在 CSS 中可以做这样的事情吗？

--c new array (color:#ddd, color:#aaa, color:#444);

然后调用数组

arr(--c,3);

而不是

var(--c3);

我知道 CSS 不是 OOP，但能够处理这样的数据会很好，特别是如果我可以将它扩展到二维。我也明白这在理论上可能是一个毫无意义的练习，因为键入 --c3 比执行 --c,3 甚至 --c[3] 更快。值得深思。

【问题讨论】：

这就是我不喜欢“级联变量”这个绰号的原因之一——它们与您在大多数编程语言中看到的变量没有太多共同之处。
我同意。整个绰号问题正是 3 年前让我在学习 CSS 时感到沮丧的原因，直到我了解如何正确使用类和 id 以及如何根据规则和规范级联工作表。完全不同于编程语法。我只是松了一口气，他们终于添加了变量。

【解决方案1】：

CSS 中的属性不能按照您描述的方式分组到数组中。这包括自定义属性。 Sass 和 LESS 等预处理器具有映射和列表，但自定义属性的工作方式（参见 section 3 of the spec）意味着无法使用预处理器中的相同语法对它们进行分组和索引。

【讨论】：