IcoMoon是免费的标志库。 可以下载需要的图标
三、使用流程、操作演示进入首页，点击下图所示区域开始。
可以自己标记每个图标(向上移动可以看到Edit。 请单击)，然后——
注：编辑框下的Download将下载图标的svg格式的zip文件。 Replace按钮是上面新生成的图标，Duplicate是原始替换。
选择所需的图标后，单击页面底部黑色条上方的f形图标按钮生成字体。
将显示如下图所示的画面。
剩下的点击上面照片的下载标记下载了zip包文件：
得到icomoon*.zip的文件。 例如，在icomoon1512.zip中，打开zip包将显示适合每个浏览器的字体和demo演示。
然后，葫芦画瓢别可以使用这些图标形状的字体！
四. IcoMoon demo头像字体使用了HTML5和一些高级的CSS技巧来显示个人资料demo的文字头像。
重要的代码如下。
[ data-icon ] : before { font-family : ' ico moon '； 内容： attr (数据身份)； 速度： none； 这意味着包括data-icon属性(HTML5 data-* )在内的所有标签都应该具有此样式。 使用before伪类和content内容生成，内容是" data-icon "的属性值。
见以下HTML :
divclass=' fs1 ' aria-hidden=' true ' data-icon='！' /div #x0021； 转换HTML文字，正常对应！ 文字。 我认为转义的好处是没有编码不兼容的问题。
由于上述方法和技巧都比较新，IE6~8浏览器显然是屌丝眼中的寂寞芝麻。 因此，在实际的传统web项目中，(手机可以自然完成)是不适用的。
五.使用其他开源图标字体，IcoMoon上有600个图形也不一定能满足我们的特定需求。 我该怎么办？
1 .在中找到相应的图标下载文件svg或fonts文件。
在IcoMoonAPP页上，单击以下图标以导入SVG文件：
然后，我们定制的字体就会出现：
与4~10.icomoon的600个字符操作相同，该选择、编辑、删除、生成，以上进一步示出，但在此不进行说明。
总结： http://www.zhangxinxu.com/WordPress/2012/06/free-icon-font-usage-ico moon /
转载于：https://www.cn blogs.com/xiaofen Guo/p/6118340.html