1，把psd文件另存为eps文件（ai能打开的格式），前提图标有路径,

2，用ai打开eps文件

3，新建一个空白文件100*100，然后把图标复制进来，等比拉宽至最大化

4，如果图标有蒙版，就点击图标右键“释放剪切蒙版”，然后把蒙版删掉，左键单击黑色幕布，使图标失焦（后来我发现其实不用释放蒙版会比较好，释放的话有的矢量图生成icon的时候，会分成几个部分）

5，按删除键删除黑色幕布，剩下图标的路径

6，点击左边工具栏“颜色”，使路径上色，黑色即可

7，保存svg格式

8，命名为图标形象即可，比如书本为book，有重复的就写book2

9，用以下网址制作iconfont

https://icomoon.io/app/#/select

用网站把图标做成iconFont文件引用的更多相关文章

  1. 图标字体(IconFont)制作

    图标字体(IconFont)介绍 图标字体(IconFont)现在越来越被广泛使用,大大提高了网页的多样化,解决了视网膜屏幕失真的问题. 据说微软从IE4开始支持的这个私有方法(@font-face) ...

  2. 字体图标库 iconfont、iconmoon 的维护管理与使用探索

    字体图标库的使用 这是之前留下的博客,由于一堆博客没写完,本周周末做了个补充,可能内容上会有点不太斜街,请见谅... 本文大部分内容是自己结合过往经验探索总结的字体图标维护方式 iconfont-阿里 ...

  3. !!字体图标（iconfont、Fontello 、雪碧图生成工具。Glyphicons、fontawesome 等）。 图片压缩

    http://www.iconfont.cn/  阿里巴巴矢量图标库 iconfont http://fontawesome.io fontawesome图标 http://www.bootcss.c ...

  4. CSS高级技巧 图标字体ICONFONT的使用方法视频

    图标字体  iconfont 这是一种字体,它跟svg 有很大 相似点   它是矢量的,放大缩小不失真的.很且很小. 我们把它成字看来. 字体 在 从ie4就开始支持的.  兼容性很好 唯一麻烦的地方 ...

  5. 小程序中使用阿里图标库iconfont

    小程序中使用阿里图标库iconfont 项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别.下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标. 第一 ...

  6. WPF使用矢量字体图标(阿里巴巴iconfont)

    原文:WPF使用矢量字体图标(阿里巴巴iconfont) 版权声明:本文为博主原创文章,转载请注明出处. https://blog.csdn.net/lwwl12/article/details/78 ...

  7. 如何更换织梦cms系统的网站小图标

    织梦cms建站现在已经是很普遍的建站方式了,下面小编就分享一个简单的换网站小图标的方法! 一.登录自己网站的后台管理系统.在不修改织梦后台的情况下,默认的url是自己的网站后台dede目录下访问. 二 ...

  8. [RN] React Native 使用 阿里巴巴 矢量图标库 iconfont

    React Native 使用 阿里巴巴 矢量图标库 iconfont 文接上文: React Native 使用精美图标库react-native-vector-icons 本文主要讲述 如何 使用 ...

  9. 阿里妈妈的iconfont的引用问题

    一.先进官网 我们看到了上面的这些图标,是不是很心动,阿里妈妈就是给力,给马老师点赞,但是问题来了我们怎么去使用呢. 二.点击图标 嘿嘿,上面的操作步骤我就不多说了吧,我相信大家都会做的,接下来我们就 ...

随机推荐

  1. React文档（十）表单

    HTML表单元素和 React里的其他DOM元素有些不同,因为它们会保留一些内部的状态.举个例子,这个普通的表单接受唯一的name值: <form> <label> Name: ...

  2. Java中char和String的相互转换

    转自:http://blog.csdn.net/yaokai_assultmaster/article/details/52082763 Java中char是一个基本类型,而String是一个引用类型 ...

  3. vscode sass live compiler

    { "liveSassCompile.settings.formats": [{ "format": "expanded", "e ...

  4. c#关于捕获错误的问题

    一般捕获错误,采用try,catch,但是有时捕获的错误不明朗,完全不知道是什么错误,这是可以取消try,catch调试运行,找到错误后并修正后,再把try,catch加上.

  5. vs2017如何设置类或函数前不显示引用的数量

    这几天,从vs2013换成vs2017,17版本增加了一个类或函数前提示引用的数量,这个感觉很别扭,如何取消显示这个呢? 问题如下: 取消显示这个引用的步骤: 找到菜单栏: 工具 ---> 选项 ...

  6. qssp2017 source

    ftp://ftp.gfz-potsdam.de/pub/home/turk/wang

  7. ceph存储集群测试方案

    --测试目的 测试ceph集群的读写性能,根据测试数据了解整个ceph集群的性能情况. --测试环境 1.8节点ceph集群环境,1台虚拟机(cpu 8核,内存8G),8k的块大小,时长2小时 2.8 ...

  8. case语法

    一.文件系统访问列表 FACL :Filesystem Access Control List    文件系统访问列表 利用文件扩展保存额外的访问控制权限. setfacl: -m:设定访问控制权限  ...

  9. Java连接数据库的driver和url写法

    oracle driver="oracle.jdbc.driver.OracleDriver" url="jdbc:oracle:thin:@localhost:1521 ...

  10. linux基础之系统管理类命令

    系统管理类命令 1.reboot.halt.poweroff命令 基本介绍 reboot命令.halt命令.poweroff命令:都表示重启或者关闭系统 基本语法 reboot/halt/powero ...