一、下载自己想要的矢量图标，然后在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. AngularJS API之equal比较对象

    使用情况 1 首先,所有满足 a === 3 这种的对象,在angular.equals(a,b)中都会返回真 2 所有对象的类型,以及属性值都相同的,也会返回真 3 NaN和NaN也会返回真(在ja ...

  2. VTK初学一，a_Vertex图形点的绘制

    系统:Win8.1 QT版本:2.4.2,Mingw VTK版本:6.3 2. main.cpp #ifndef INITIAL_OPENGL #define INITIAL_OPENGL #incl ...

  3. 摄像头/光驱故障：由于其配置信息(注册表中的)不完整或已损坏，Windows 无法启动这个硬件设备。 (代码 19)

    原因:出现这条提示一般都是因为注册表错误引起的,重装驱动或应用程序无法解决. 设备管理器中相关设备-故障如图: 以下方法可以解决问题: 1.在任务栏上点“开始”菜单-“运行”,输入”regedit“ ...

  4. 【PHP面向对象(OOP)编程入门教程】19.抽象方法和抽象类（abstract）

    在OOP语言中,一个类可以有一个或多个子类,而每个类都有至少一个公有方法做为外部代码访问其的接口.而抽象方法就是为了方便继承而引入的,我们先来看一下抽象类和抽象方法的定义再说明它的用途. 什么是抽象方 ...

  5. Swift2.1 语法指南——访问控制

    原档:https://developer.apple.com/library/prerelease/ios/documentation/Swift/Conceptual/Swift_Programmi ...

  6. 第五天 loadmore

    mutating func loadFresh(completion: (result: APIResult<DeserializedType>) -> ()) -> Canc ...

  7. HDU 5053 the Sum of Cube

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5053 解题报告:用来陶冶情操的题,求a到b的三次方的和. #include<stdio.h> ...

  8. ExtJs xtype类型介绍

    自定义组件在定义的时候可以通过xtype配置为组件指定xtype短名称,此后创建对象可以通过xtype来创建自定义对象了,示例代码如下: Ext.define('MyApp.PressMeButton ...

  9. hiho #1305 区间求差

    #1305 : 区间求差 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 给定两个区间集合 A 和 B,其中集合 A 包含 N 个区间[ A1, A2 ], [ A3,  ...

  10. BZOJ 3907: 网格

    Description 求不跨过直线 \(y=x\) ,到达 \((n,m)\) 的方案数. Sol 组合数学+高精度. 这个推导过程跟 \(Catalan\) 数是一样的. 答案就是 \(C^{n+ ...