如何在 LESS CSS 中编写字体？答案

【问题标题】：How do I write font in LESS CSS?如何在 LESS CSS 中编写字体？
【发布时间】：2014-04-18 05:05:22
【问题描述】：

我有点吃不消了。大约两天前我刚刚拿起了 WinLess（我正在使用的编译器），我只是模糊地了解了 LESS 的基础。无论如何，我对这段代码有疑问：

// Font
    @verdana: font-family:"verdana";
    @sans: font-family:"sans-serif";

当我编译这个时，我得到这个消息：

ParseError：第 4 行第 3 列中无法识别的输入：

3 // Font
4 @verdana: font-family:"verdana";
5 @sans: font-famlit:"sans-serif";

谁能帮帮我？谢谢！

【问题讨论】：

【解决方案1】：

你可以像这样声明它：.myfont{ font-family:"some family, some generic family"}，然后像这样使用它：div{ .myfont; }

【讨论】：

【解决方案2】：

我只知道这样：

@variable_name: 'individual_font_name', Verdana, sans-serif;

具有名称的字体变量，字体名称如“My_Verdana”和主字体，第二个作为主字体失败的示例。

希望这会有所帮助，问候。

【讨论】：

【解决方案3】：

对于 LESS 1.7+

他们现在添加了rulesets，其工作方式如下：

@verdana: {font-family:"verdana"};

.myClass {
    @verdana();
}

注意语法：您传递了一个带括号的{} 属性集，并在变量名后使用括号() 访问它，很像mixin。如您所见，它的功能也很像 mixin（类似于 lucian 的答案），但它具有附加值 它可以作为参数传递，所以这是可能的：

少

@verdana: {font-family:"verdana"};

.myMix(@font) {
    @font();
}

.test {
  .myMix(@verdana);
}

CSS 输出

.test {
  font-family: "verdana";
}

【讨论】：