在 Less CSS 中向列表添加值答案

【问题标题】：Add a value to a list in Less CSS在 Less CSS 中向列表添加值
【发布时间】：2014-12-31 17:32:14
【问题描述】：

鉴于以下情况：

@list: 'banana', 'apple';

如何在 LESS CSS 中将值“橙色”添加到此列表中？

我尝试了以下方法但没有成功：

@list+: 'orange';
@list: @list + 'orange';
@list: @list ~ 'orange';

【问题讨论】：

根据here 找到的评论，我认为这是不可能的。

标签： css list append less concatenation

【解决方案1】：

你不能那样做。较少的变量使用最后一个声明 获胜规则。引用自身的变量将创建一个循环，分配的值成为最后声明的值，依此类推。

您可以使用loop 构建一个列表，您可以将其作为值分配给属性。

LESS loops used to generate column classes in twitter - How do they work? 向您展示了如何构建选择器列表。

【讨论】：

【解决方案2】：

这不完全是您的问题，但您可以创建一个包含原始列表的新列表：

@list: 'banana', 'apple';
@new-list: 'orange', @list;

// Using these in classes for display in less2dss.org:
.list {
  content: @list;
}
.new-list {
  content: @new-list;
}

这会输出这个（无意义的）CSS 作为确认：

.list {
  content: 'banana', 'apple';
}
.new-list {
  content: 'orange', 'banana', 'apple';
}

在less2css 中查看此内容。

【讨论】：