一、下载自己想要的矢量图标，然后在AI中打开
二、在AI中将有瑕疵的图标修改一下，再分别另存为svg格式的图标
三、打开IcoMoon Web app网页，然后点击左上角的+Import Icons添加你保存的svg格式的图标
四、你也可以添加IcoMoon Web app网页原有的图标，图标外框变橘黄时就是你选中的图标（可多选）
五、选择好后点击网页右下角Generate Font进入生成页面
六、你可以根据你的爱好编辑一个字体名称以便后期调用
七、全部改好后就点击右下角的Download把字体下载下来，下载的是压缩包，
解压后在fonts文件下找到.ttf文件拿到你要用的项目字体文件中去就行了其他的没啥用
八、接下来就是调用字体了，下面是具体代码

是不是挺简单的？！再简单的东西看看都不如实践实践，自己练习一遍，比看十遍印象都深刻，赶紧试试吧！

把图标改成web字体的更多相关文章

  1. 如何把你的图标转换成web字体

    在这篇教程中,我们将使用一个免费的Web应用程序IcoMoon将矢量图转换成Web字体,然后将生成的字体通过css应用到Web页面中. 通常我们在网站中必不可少的会使用到一些小图标.在正常尺寸下,布局 ...

  2. ICOMOON！强悍的WEB字体图标制造器/Web字体使用实例

    IcoMoon!一个可以通过个性化设置来创建自定义图标(字体)的生成器!也可以将SVG图片,转换成web字体 IcoMoon是一项免费的服务,通过使用不同设置使我们能够创建自定义的ICON图或ICON ...

  3. android 怎样将主菜单图标改成按安装时间排序

    1. 在 LauncherModel.java 中增加例如以下代码, 假设是KK Launcher3 ApplicationInfo要替换为AppInfo public static final Co ...

  4. Web字体工具整理，网页图标字体以及使用方法整理

    常用网站app logo 下载: http://www.iconfont.cn/collections/show/268?spm=a313x.7781069.0.0.nDYawz 1.Web字体免费生 ...

  5. 从零开始学 Web 之 CSS3（六）动画animation，Web字体

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  6. CSS3：不可思议的border属性&Web字体图标Font Awesome

     CSS3:不可思议的border属性 转载至——译文:不可思议的CSS border属性 原文:Magic of CSS border property Web字体图标Font Awesome 转载 ...

  7. Kendo Web UI Grid数据绑定，删除，编辑，并把默认英文改成中文

    Kendo Web UI 是个不错的Jquery框.可惜老外写的,很多都是默认的英文,当然我们也可以设置成中文,接下来,我们就看看Grid是如何实现的数据绑定(Kendo Grid数据绑定实现有很多方 ...

  8. web字体图标的使用

    今天给大家介绍一些web字体图标的下载和使用 一.WEB字体 1. 下载外部的字体图标的网站 font-awesome.com 2.CSS文件和font文件 3.html文档中使用外部字体 4.下载字 ...

  9. 字体图标-把SVG图标转换成所需要的字体图标

    小科普: 想必小伙伴们多少都了解或使用过字体图标,总体来说优点多于缺点,优点如下图: 任意缩放,图标不会失真: 可以改变图标颜色: 可以设置图标阴影: 可以设置透明效果: 主流浏览器都支持: 可以快速 ...

随机推荐

  1. 新手使用R的注意事项

    1.最好先设置工作目录 如: setwd(“D:/DataDig”) 注意不是”\”,是”/” 再读取数据,如: datafile = read.csv("./test.csv") ...

  2. svg技术（可缩放矢量图形）介绍

    公司里面的产品用图表的地方也比较多,作为平台维护的我,收到几次需求提的建议中包括图表美化的功能,要炫,要3d,立体感,功能要强大等到:平台现有控件都是用的一个开源flash,我对flash虽然会一点但 ...

  3. MarkDown 语法

    1. 代码注释 ` ` 2.标题注释 # 3. 文章注释 ```` ```` 4.超链接 This is [an example](http://example.com/ "Title&qu ...

  4. cpu利用率和cpu 队列

    SIP的第四期结束了,因为控制策略的丰富,早先的的压力测试结果已经无法反映在高并发和高压力下SIP的运行状况,因此需要重新作压力测试.跟在测试人员后面做了快一周的压力测试,压力测试的报告也正式出炉,本 ...

  5. mongoDB- - 2 增、删、改 操作

    1.创建数据库 语法:use database 说明:如果database不存在,就会创建database:如果存在就会切换到database 2.查看所有数据库 语法:show dbs; 说明:如果 ...

  6. XH

    1.  又到父亲节,那就给老爹做顿饭呗,让他开心开心. 老爸吃了一口我炒的菜,流露出感动的泪花说:儿呀,你能为爸爸做饭,爸爸感到特别开心,但是你这个菜,看在今天是父亲节 我能不能不吃呀! 2.  一哥 ...

  7. WebStorm设置编辑器中的字体大小

    启动webStorm之后,点击“FIle"菜单,选择其下的”Settings" 2.在左侧的菜单中选择“Editor/Colors & Fonts/Font 在右侧Sche ...

  8. java历史

    1.产生: 1990年初sun公司James Gosling等员工开发java语言的雏形,最初被命名为Oak,定位于家用电器的控制和通讯,随后因为市场的需求,公司放弃计划,后面由于Internet的发 ...

  9. 信号屏蔽的切换的理解sigsuspend

    #include <stdio.h> #include <stdlib.h> #include <signal.h> #include <unistd.h&g ...

  10. Maven编译项目报错：某些类找不到符号

      遇到Maven在编译项目源码时候出现找不到符号错误,主要归结为以下几个问题: 1. 可能项目编码格式不统一. 2. 可能项目编码使用的JDK版本不统一. 项目可能是当前项目也可能是继承的父项目,还 ...