给font awesome中加入自定义图片

工具：http://icomoon.io 在线工具

http://www.inkscape.org/en/download/windows/ 下载安装

参考教程 http://birchenough.co.uk/edit-font-awesome-icon-add-font-awesome-font/

 

访问 http://icomoon.io/ 

点击右上角

界面加载完成后，点击左上角

选择你现在正在使用的font awesome对应的svg文件，一定要是现在使用的，防止出现ico不对应

之后会加载出目前现有的ico

使用工具编辑

编辑任意一个

弹出框中选择download，保存到本地

 

打开incspace，使用打开功能打开刚才下载的文件，注意一定要使用打开，而不要把文件拖到软件里

使用打开后，纸张大小会变化

使用拖动，纸张大小不会变

我们需要的是他的纸张大小

可以在原有的基础上修改

也可以把原有的删掉自己重画

随便画个什么，尽量充满画纸

另存为，普通svg

回到网页

导入到set，选择刚刚制作的svg

默认会放到第一个

如果希望，可以移动位置

编辑

tags就是生成的css的class，默认和文件名一样，可以修改，最终会生成icon-test

 

全选

 

下方，点完以后可能会有一段时间没反应，耐心等待

文字是e600，font awesome默认是从f000开始，如果你想继续，也可以修改这个e600

上方的，点击后弹出更多设置

 

最后下方

找到font文件夹中的几个文件

，复制到原来的font目录下

打开原来的font-awesome.css

修改这里的路径，对应到刚才的几个文件

打开下载的style.css

找到

这是我们刚加进去的那个ico，把这个类复制到原来的css文件中

如果使用到了ie7，你可以同样的修改一下ie7的css

 

注意，svg是矢量图，所以你的图中的 点，线 越少，生成的文件越小，否则会非常大