用网站把图标做成iconFont文件引用
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文件引用的更多相关文章
- 图标字体(IconFont)制作
图标字体(IconFont)介绍 图标字体(IconFont)现在越来越被广泛使用,大大提高了网页的多样化,解决了视网膜屏幕失真的问题. 据说微软从IE4开始支持的这个私有方法(@font-face) ...
- 字体图标库 iconfont、iconmoon 的维护管理与使用探索
字体图标库的使用 这是之前留下的博客,由于一堆博客没写完,本周周末做了个补充,可能内容上会有点不太斜街,请见谅... 本文大部分内容是自己结合过往经验探索总结的字体图标维护方式 iconfont-阿里 ...
- !!字体图标(iconfont、Fontello 、雪碧图生成工具。Glyphicons、fontawesome 等)。 图片压缩
http://www.iconfont.cn/ 阿里巴巴矢量图标库 iconfont http://fontawesome.io fontawesome图标 http://www.bootcss.c ...
- CSS高级技巧 图标字体ICONFONT的使用方法视频
图标字体 iconfont 这是一种字体,它跟svg 有很大 相似点 它是矢量的,放大缩小不失真的.很且很小. 我们把它成字看来. 字体 在 从ie4就开始支持的. 兼容性很好 唯一麻烦的地方 ...
- 小程序中使用阿里图标库iconfont
小程序中使用阿里图标库iconfont 项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别.下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标. 第一 ...
- WPF使用矢量字体图标(阿里巴巴iconfont)
原文:WPF使用矢量字体图标(阿里巴巴iconfont) 版权声明:本文为博主原创文章,转载请注明出处. https://blog.csdn.net/lwwl12/article/details/78 ...
- 如何更换织梦cms系统的网站小图标
织梦cms建站现在已经是很普遍的建站方式了,下面小编就分享一个简单的换网站小图标的方法! 一.登录自己网站的后台管理系统.在不修改织梦后台的情况下,默认的url是自己的网站后台dede目录下访问. 二 ...
- [RN] React Native 使用 阿里巴巴 矢量图标库 iconfont
React Native 使用 阿里巴巴 矢量图标库 iconfont 文接上文: React Native 使用精美图标库react-native-vector-icons 本文主要讲述 如何 使用 ...
- 阿里妈妈的iconfont的引用问题
一.先进官网 我们看到了上面的这些图标,是不是很心动,阿里妈妈就是给力,给马老师点赞,但是问题来了我们怎么去使用呢. 二.点击图标 嘿嘿,上面的操作步骤我就不多说了吧,我相信大家都会做的,接下来我们就 ...
随机推荐
- activiti 快速入门--组任务(candidate users)分配(6)
http://blog.csdn.net/u011320740/article/details/53018040
- 皮质学习 HTM 知多少
目录 Hierarchical Temporal Memeory 0.1 引言 历史 HTM 概览 HTM的层级结构 神经元 HTM 端对端应用框架[^8] 数据编码[^1] 数据编码 数据输入 树突 ...
- zabbix3.4.7利用Windows性能监视器监控各项资源指标
zabbix自带的windows监控模板并没有监控windows cpu使用率的监控 在cmd命令的窗口输入perfmon,就会弹出一下界面 点击性能监视器 点击如图加号,出现很多参数 选择proce ...
- vue的.vue文件是怎么run起来的(vue-loader)
vue的.vue文件是怎么run起来的(vue-loader) 引子:vue的.vue文件是怎么跑起来的? 答:通过vue-loader,解析.vue文件,在webpack解析,拆解vue组件 1.v ...
- ThinkPHP5的数据操作和Thinkphp3.2.3对比小结
前言: 由于Thinkphp5和Thinkphp3.2.3的版本差距过大, 在记忆方面容易混淆. 故特意记录一下在数据操作上的对比的不同. Tp3.2.3 增:add(),addAll() 查:fin ...
- 《TypeScript 中文入门教程》
转载:<TypeScript 中文入门教程> 17.注解 (2015-12-03 11:36) 转载:<TypeScript 中文入门教程> 16.Symbols (2015- ...
- Linux分区知识及企业场景分区76
文件系统就相当于装修一样.这个硬盘拿过来了,分完区了,没有格式化. 没有格式化就相当于没有装修.[分区]不是必须的. 如果没有文件系统就不能放数据,文件系统可以理解为一个软件, 它的实现形式是软件,这 ...
- springBoot的数据库操作
一:操作数据库起步 1.Spring-Data-Jpa JPA定义了对象持久化的标准. 目前实现了有Hibernate,TopLink 2.pom添加依赖 <dependency> < ...
- sql中的内联和外联(简单用法)
有两张表:user和department User表: CREATE TABLE `user` ( `id` int(11) NOT NULL AUTO_INCREMENT, `name` ...
- lvm创建和在线扩容
添加磁盘后创建lvm lsblk 或是fdisk -l 查看添加的磁盘 fdisk -l lsblk 进入到sdb创建分区 n新建p标准分区e扩展分区1序列号 加10G或全给 p查看 要创建lv ...