css - 将多个字体文件合并到一个 @font-face 中

Question

我有以下代码:

@font-face {
  font-family: 'icomoon';
  src:url('../fonts/icons/icomoon.eot?2hq9os');
  src:url('../fonts/icons/icomoon.eot?#iefix2hq9os') format('embedded-opentype'),
  url('../fonts/icons/icomoon.woff?2hq9os') format('woff'),
  url('../fonts/icons/icomoon.ttf?2hq9os') format('truetype'),
  url('../fonts/icons/icomoon.svg?2hq9os#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

现在，问题是我被迫使用多个图标集(来自多个文件)，并且为了方便和干净的结构，我希望仅在一个“icomoon”中拥有所有这些图标(来自所有文件)字体。

例如，如果:

../fonts/icons/icomoon.* includes icon-1 / icon-2 and icon-3

and 

../fonts/icons/customicon.* includes icon-4 / icon-5

如何将它们全部包含在

@font-face {
  font-family: 'icomoon';
  -- include multiple files --
}

div#selector { // will have con-1 / icon-2 / icon-3 / icon-4 / icon-5
  font-family: icomoon; 
}

这可能吗？

Answer 1

我认为为此目的你可以使用IcoMoon插入。 使用它，您可以将 FontAwesome 与您的图标等结合起来创建自定义字体。