工具: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是矢量图,所以你的图中的 点,线 越少,生成的文件越小,否则会非常大

给font awesome中加入自定义图片的更多相关文章

  1. echarts 中 symbol 自定义图片

    首先我使用的技术框架的VUE,当然该方法在其他框架也是适用的,这点大家注意一下~ 在官方文档里面,修改标记的图形(symbol)的方法有三种: 一:ECharts 提供的标记类型有 'circle', ...

  2. ueditor 百度编辑器 自定义图片上传路径和格式化上传文件名

    今天项目中需要自定义图片上传的保存路径,并且不需要按照日期自动创建存储文件夹和文件名,我的ueditor版本是1.3.6.下面记录一下我配置成功的方法,如果有什么不对的地方欢迎指出,共同学习: 1:我 ...

  3. Expo大作战(十二)--expo中的自定义样式Custom font,以及expo中的路由Route&Navigation

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  4. 在xcode中新建项目使用Image.xcassets时不显示自定义图片

    这个很简单,先在Images.xcassets中设置一个LaunchImage,然后再项目设置的general-->App Icons and Launch Images-->Launch ...

  5. vue项目富文本编辑器vue-quill-editor之自定义图片上传

    使用富文本编辑器的第一步肯定是先安装依赖 npm i vue-quill-editor 1.如果按照官网富文本编辑器中的图片上传是将图片转为base64格式的,如果需要上传图片到自己的服务器,需要修改 ...

  6. AJ学IOS(44)之网易彩票自定义图片在右边的Button_弹出view_ios6,7简单适配

    AJ分享,必须精品 效果: 注意图里面了吗,其实那个效果做起来真的很简单,在iOS中苹果给我们封装的很好,关键是那个按钮 系统的按钮的图片是在左边的,这里我们需要把他调整到右边,然后呢需要我们自己做一 ...

  7. UWP中实现自定义标题栏

    UWP中实现自定义标题栏 0x00 起因 在UWP开发中,有时候我们希望实现自定义标题栏,例如在标题栏中加入搜索框.按钮之类的控件.搜了下资料居然在一个日文网站找到了一篇介绍这个主题的文章: http ...

  8. Android中常见的图片加载框架

    图片加载涉及到图片的缓存.图片的处理.图片的显示等.而随着市面上手机设备的硬件水平飞速发展,对图片的显示要求越来越高,稍微处理不好就会造成内存溢出等问题.很多软件厂家的通用做法就是借用第三方的框架进行 ...

  9. android 加载自定义图片并在图片上绘图

    来源:毕设 关键词:Bitmap Canvas //毕设中需要自定义室内地图,并且在地图上绘制轨迹 //此处是一个测试Demo,实现图片的加载和记录手指在屏幕上的运动轨迹 图片的载入 使用系统提供的内 ...

随机推荐

  1. 【加密算法】MD5

    一.简介 MD5的全称是Message-Digest Algorithm 5(信息摘要算法),在90年代初由MIT Laboratory for Computer Science和RSA Data S ...

  2. C#: 获取当前路径不要用Environment.CurrentDirectory

    网上大把文章写到C#获取当前路径的方法如下: // 获取程序的基目录. System.AppDomain.CurrentDomain.BaseDirectory // 获取模块的完整路径. Syste ...

  3. BitAdminCore框架更新日志20180522

    20180522更新内容 本次更新增加了excel导入导出示例,QuerySuite组件实现导出导出,用最少代码,做最多的事,代码就是如此简单. 计划修改内容 1.人脸登录功能需要重构,目前功能不完善 ...

  4. 知物由学 | AI时代,那些黑客正在如何打磨他们的“利器”?(一)

    本文由  网易云发布. “知物由学”是网易云易盾打造的一个品牌栏目,词语出自汉·王充<论衡·实知>.人,能力有高下之分,学习才知道事物的道理,而后才有智慧,不去求问就不会知道.“知物由学” ...

  5. python web开发——c2 flask框架和flask_script

    重定向/error 通过flask中的redirect方法和自定义的newpath函数.redirect_demo函数实现重定向: #coding:utf-8 from flask import Fl ...

  6. Python廖雪峰学习笔记——操作文件和目录

    查看当前目录的绝对路径: >>>os.path.abspath('.') # 在某个目录下创建一个新目录, # 首先把新目录的完整路径表示出来: >>> os.pa ...

  7. android界面

    自定义控件EditText 在src中的drawable新建myeditext.xml文件<?xml version="1.0" encoding="utf-8&q ...

  8. 极大提高Web开发效率的8个工具和建议(含教程)

    面对复杂的 Web 应用的开发,良好的流程和工具支持是必不可少的,它们可以让日常的开发工作更加顺畅.更加高效.本文介绍了6个Web开发利器以及相关的教程,帮助你在开发.调试.集成和发布过程极大地提高效 ...

  9. JavaScript基础事件(6)

    day53 参考:https://www.cnblogs.com/liwenzhou/p/8011504.html#autoid-2-3-8 事件 HTML 4.0 的新特性之一是有能力使 HTML ...

  10. nginx 开启GZIP、域名指向index.html

    nginx 虽然默认开启了gzip压缩,但是有关压缩文件.压缩效率没有开启,在建设我的(个人博客)[www.fayinme.cn]中,直观的感受到gzip带来的访问速度提升的快感. 如何开启GZIP ...