连接两个或多个变量的值

要将两个或多个变量的值连接成一个字符串并将其作为输出打印,我们需要使用插值。

以下 Less 代码,

#demo:after {
  @var1: Hello;
  @var2: World!!!;
  content: "@{var1} @{var2}";
}

编译时会设置 “Hello World !!!” 作为 content 属性的价值。下面是编译的 CSS:

#demo:after {
  content: "Hello World!!!";
}

如果两个或多个变量的值仅需要以空间分离的方式彼此相邻放置,则不需要插值。

#demo {
  @top: 4px;
  @right: 2px;
  @bottom: 6px;
  @left: 4px;
  padding: @top @right @bottom @left;
}

编译上面的代码时,会生成以下 CSS。

#demo {
  padding: 4px 2px 6px 4px;
}

当结果字符串需要在引号内时,变量值(或)之间不应有空格时,此方法将不起作用。对于这些情况,插值的使用是强制性的。