一、下载自己想要的矢量图标,然后在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. WCF--提示:异常消息为“传入消息的消息格式不应为“Raw”。此操作的消息格式应为 'Xml', 'Json'。

    Ajax调用WCF服务... 本来用 // $.getJSON("http://localhost:16625/Service1.svc/Article_GetInfo", { } ...

  2. Ansible简明使用手册

            Ansible使用简明手册 1.简介 ansible是新出现的自动化运维工具,基于Python开发,集合了众多运维工具(puppet.cfengine.chef.func.fabric ...

  3. MySQL性能优化的21条最佳经验【转】

    转载自http://www.cnblogs.com/jiaosq/p/5843437.html 今天,数据库的操作越来越成为整个应用的性能瓶颈了,这点对于Web应用尤其明显.关于数据库的性能,这并不只 ...

  4. appid 评价

    //apple api #define kAppAppleId         @"980883989" #define kAppRateUrl         @"it ...

  5. ubutu之Navicat安装

    1.下载navicat111_premium_cs.tar.gz压缩包 2.进入压缩包所在目录,执行一下命令解压 tar -zxvf navicat111_premium_cs.r.gz 3.进入解压 ...

  6. HDU 1232 并查集/dfs

    原题: http://acm.hdu.edu.cn/showproblem.php?pid=1232 我的第一道并查集题目,刚刚学会,我是照着<啊哈算法>这本书学会的,感觉非常通俗易懂,另 ...

  7. phpMyAdmin 缺少 mysqli 扩展。请检查 PHP 配置

    好久没有在windows下配置php了,今天,按照前一篇文章配置好,打开phpmyadmin时,出现如下问题: phpMyAdmin 缺少 mysqli 扩展.请检查 PHP 配置 网上搜索解决方案, ...

  8. TP5的图片上传

    public function upload(){ // 获取表单上传文件 例如上传了001.jpg $file = request()->file('image'); $picture=mod ...

  9. VirtualBox centos 6.5 minimal 开启网络

    默认情况下载的centos 6.5 minimal是不开启网卡功能的,按照下面的步骤开启网卡. vi /etc/sysconfig/network-script/ifcfg-eth0 将其中的 ONB ...

  10. ACM-括号匹配问题

    对ACM仰慕已久,无奈今天才开始.好吧,遇到的第二个题目就把我难到了.(实话是第一个) 进入正题,下面Copy出题目:  现在,有一行括号序列,请你检查这行括号是否配对. 输入 第一行输入一个数N(0 ...