字体图标连字

Question

我用 fontello 制作了我的字体图标集。目前它是这样工作的：

<div class="icons_class home" ng-click="toHome()"></div>

而对应的class的CSS为：

.icons_class {
   font-family: 'myFont';
   ...
   ...
}
.home:before {
   content: '/e822';
}

但我想这样使用：

<div class="icons_class" ng-click="toHome()">home</div>

喜欢 material 图标。

可能吗？我必须为此目的使用连字吗？

Answer 1

我做到了

我必须使用 icomoon.io 而不是 fontello.com，其中有一个特定的连字功能：

Ligatures

To enable/disable ligatures, press the fi button in the font tab of the app. By enabling ligatures, you will be able to assign words/tags to each glyph. (use comma to assign multiple words to each glyph.)

If the platform in which you use your font supports ligatures, typing the words you assign to each glyph would bring up that glyph. Ligatures are not supported in IE 9 and older, but the IcoMoon app provides a javascript polyfill for you. IE 10 and other modern browsers support ligatures.

字体图标连字

Font icon ligatures

html

css

icon-fonts