Less font-face src url包含字体族

Question

我刚刚继承了一个应用程序，变量较少的文件设置如下:

@icon-font-path:          "../fonts/";
@exampleFont: exampleFont, 'Helvetica Neue', Helvetica, Arial, sans-   serif;
@font-face {
  font-family: exampleFont; 
  src: url('@{icon-font-path}@{exampleFont}.ttf') format('truetype'); 
  font-weight: normal;
  font-style: normal;
}

编译后的CSS

@font-face {
  font-family: exampleFont;
  src: url('../fonts/exampleFont, 'Helvetica Neue', Helvetica, Arial, sans-serif.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

}

有没有人知道为什么src url包含url和字体家族，当它被编译时，它结合了两者，仍然有效?我从来没见过这样做。

Answer 1

src应该是src: url('@{icon-font-path}exampleFont.ttf') format('truetype');

在当前代码中，它有@{exampleFont}，它将展开为变量的值

Answer 2

下面是一个关于如何在LESS中使用mixin字体的工作示例:

https://github.com/MarcoHengstenberg/helpCSS/blob/master/help.css L528-L547

在第533行，你必须用常规字体(400,normal)的实际值替换weight和style。