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. 数据结构与算法之PHP排序算法(归并排序)

    一.基本思想 归并排序算法是将两个(或两个以上)有序表合并成一个新的有序表,即把待排序序列分为若干个子序列,使每个子序列有序,再将已有序的子序列合并,得到完全有序的序列.该算法是采用分治法(Divid ...

  2. Java IO编程全解(二)——传统的BIO编程

    前面讲到:Java IO编程全解(一)——Java的I/O演进之路 网络编程的基本模型是Client/Server模型,也就是两个进程之间进行相互通信,其中服务端提供位置信息(绑定的IP地址和监听端口 ...

  3. js如何在浏览器添加cookie(添加、获取、删除)

    首先,简单用js将cookie保存到浏览器中,具体可按F12在这里查看(火狐浏览器) 1.js脚本方法 1)添加cookie方法 //添加cookie var addCookie = function ...

  4. FPGA型号解读

  5. fastTime从后台传过来显示格式的处理

    1.可以在控制台用syso查看 QuestionFeedbackView qfv = on_LineManageService.getBringupHead(projectNo);//qfv是一个内含 ...

  6. LAMP架构(二)

    第十八次课 LAMP架构(二) 目录 一.Apache默认虚拟主机 二.Apache用户认证 三.域名跳转 四.Apache访问日志 五.访问日志不记录静态文件 六.访问日志切割 七.静态元素过期时间 ...

  7. HDU5616 天平能否称出物体重量问题 01背包变形或者折半搜索

    //hdu5616 void solve1(){dp[0]=1;for(int i=1;i<=n;i++){for(int j=INF;j>=val[i];j--){dp[j]|=(dp[ ...

  8. 2019-04-11-day030-网络编程并发

    内容回顾 黏包 tcp协议为了保证数据的可靠传输和传输效率 合包机制 : 连续多条短数据会合并成一条 拆包机制 : 一个过大的数据会在发出之前被拆成几个小包 tcp的黏包发生在两端: 发送端 : 合包 ...

  9. 剑指Offer 14. 链表中倒数第k个结点 (链表)

    题目描述 输入一个链表,输出该链表中倒数第k个结点. 题目地址 https://www.nowcoder.com/practice/529d3ae5a407492994ad2a246518148a?t ...

  10. ie8网页时调用特定的css文件

    加上条件注释语句<!--[if IE 8]><link rel="".........................><![endif]--> ...