如何在较少使用 Mixins 的情况下编写 html 自定义属性

How to write html custom attribute in less use Mixins

如何在 .less 中编写 html 自定义属性 例如使用 Mixins

[margin="2"]{margin:2px;}

您应该解释为什么要在这种情况下使用 Less。请注意,Less 仅编译 static CSS.

您可以使用 Less mixin 动态构建您的 CSS 规则:

.createmargins(@i) {
& when (@i > 1) {
.createmargins(@i - 1);
}
[margin="@{i}"] { margin: unit(@i,px); }
}

.createmargins(100);

输出:

[margin="1"] {
  margin: 1;
}
[margin="2"] {
  margin: 2;
}
[margin="3"] {
  margin: 3;
}

等等……

演示:http://codepen.io/anon/pen/yyXEgg

以上可能会生成大量未使用的CSS类。或者考虑在 DOM ready:

上使用 jQuery(或 jvascript)
$("[margin]").each(function(){

 $(this).css('margin',$(this).attr('margin') + 'px');

});

演示:http://codepen.io/anon/pen/rawKjz