较少分离的规则集与非参数混合

时间:2015-05-28 12:53:16

标签: css less less-mixins

分离的规则集之间是否存在实质性差异,例如

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

和非参数混合? E.g。

@detached-ruleset: {
  @margin: 1px;
  margin: @margin;
};

它们对嵌套运算符的行为是否相同?

最明显的区别是语法(分号对于规则集是强制性的),而规则集将其变量保密,但这就是我能找到的。手册中没有详细说明。

1 个答案:

答案 0 :(得分:5)

分离的规则集是一个变量。对于Less中的变量,最后一个声明获胜并且变量是延迟加载的。

对于可重用代码,您可以通过定义具有相同名称的第二个mixin()来轻松扩展.mixin():

.mixin() {
  @margin: 1px;
  margin: @margin;
}

.mixin() {
  color: red;
}

在上面使用分离的规则集时,你应该重复所有的属性,因为第二个声明会覆盖第一个:

@detached-ruleset: {
  @margin: 1px;
  margin: @margin;
};

@detached-ruleset: {
  @margin: 1px;
  margin: @margin;
  color: red;
};

另请参阅:https://stackoverflow.com/a/30384948/1596547