把图标改成web字体
一、下载自己想要的矢量图标,然后在AI中打开
二、在AI中将有瑕疵的图标修改一下,再分别另存为svg格式的图标
三、打开IcoMoon Web app网页,然后点击左上角的+Import Icons添加你保存的svg格式的图标
四、你也可以添加IcoMoon Web app网页原有的图标,图标外框变橘黄时就是你选中的图标(可多选)
五、选择好后点击网页右下角Generate Font进入生成页面
六、你可以根据你的爱好编辑一个字体名称以便后期调用
七、全部改好后就点击右下角的Download把字体下载下来,下载的是压缩包,
解压后在fonts文件下找到.ttf文件拿到你要用的项目字体文件中去就行了其他的没啥用
八、接下来就是调用字体了,下面是具体代码
是不是挺简单的?!再简单的东西看看都不如实践实践,自己练习一遍,比看十遍印象都深刻,赶紧试试吧!
把图标改成web字体的更多相关文章
- 如何把你的图标转换成web字体
在这篇教程中,我们将使用一个免费的Web应用程序IcoMoon将矢量图转换成Web字体,然后将生成的字体通过css应用到Web页面中. 通常我们在网站中必不可少的会使用到一些小图标.在正常尺寸下,布局 ...
- ICOMOON!强悍的WEB字体图标制造器/Web字体使用实例
IcoMoon!一个可以通过个性化设置来创建自定义图标(字体)的生成器!也可以将SVG图片,转换成web字体 IcoMoon是一项免费的服务,通过使用不同设置使我们能够创建自定义的ICON图或ICON ...
- android 怎样将主菜单图标改成按安装时间排序
1. 在 LauncherModel.java 中增加例如以下代码, 假设是KK Launcher3 ApplicationInfo要替换为AppInfo public static final Co ...
- Web字体工具整理,网页图标字体以及使用方法整理
常用网站app logo 下载: http://www.iconfont.cn/collections/show/268?spm=a313x.7781069.0.0.nDYawz 1.Web字体免费生 ...
- 从零开始学 Web 之 CSS3(六)动画animation,Web字体
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- CSS3:不可思议的border属性&Web字体图标Font Awesome
CSS3:不可思议的border属性 转载至——译文:不可思议的CSS border属性 原文:Magic of CSS border property Web字体图标Font Awesome 转载 ...
- Kendo Web UI Grid数据绑定,删除,编辑,并把默认英文改成中文
Kendo Web UI 是个不错的Jquery框.可惜老外写的,很多都是默认的英文,当然我们也可以设置成中文,接下来,我们就看看Grid是如何实现的数据绑定(Kendo Grid数据绑定实现有很多方 ...
- web字体图标的使用
今天给大家介绍一些web字体图标的下载和使用 一.WEB字体 1. 下载外部的字体图标的网站 font-awesome.com 2.CSS文件和font文件 3.html文档中使用外部字体 4.下载字 ...
- 字体图标-把SVG图标转换成所需要的字体图标
小科普: 想必小伙伴们多少都了解或使用过字体图标,总体来说优点多于缺点,优点如下图: 任意缩放,图标不会失真: 可以改变图标颜色: 可以设置图标阴影: 可以设置透明效果: 主流浏览器都支持: 可以快速 ...
随机推荐
- jquery点击label触发2次的问题
今天写问卷的时候遇到个label点击的时候,监听的click事件被执行两次:产生这个的原因么...事件冒泡 <div class="questionBox checkBox" ...
- Android应用如何监听自己是否被卸载及卸载反馈功能的实现
一个应用被用户卸载肯定是有理由的,而开发者却未必能得知这一重要的理由,毕竟用户很少会主动反馈建议,多半就是用得不爽就卸,如果能在被卸载后获取到用户的一些反馈,那对开发者进一步改进应用是非常有利的.目前 ...
- eclipse工具背景色模板-程序员保护好自己的眼睛
做为coder,要保护好自己的眼睛,eclipse 强烈推荐 Eclipse Color Theme插件,该插件包含多种当前流行的主题选择. 安装方法: 安装方法:1.先安装一个Eclipse Col ...
- Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框
转载请注明出处http://blog.csdn.net/xiaanming/article/details/11066685 今天给大家带来一个很实用的小控件ClearEditText,就是在Andr ...
- 在Fedora 20 上安装Mysql并初始化root密码
[root@localhost ~]# yum -y install community-mysql-server #安装数据库 已加载插件:langpacks, refresh-packagekit ...
- hiho #1114 : 小Hi小Ho的惊天大作战:扫雷·一
#1114 : 小Hi小Ho的惊天大作战:扫雷·一 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 故事背景:密室.监视器与充满危机的广场 “我们还是循序渐进,先来考虑这 ...
- I2C总线协议的简要说明
为了快速的了解I2C总线协议,此处采用另类的方式进行说明. 倘若你和另外一个人只能通过一个开关加灯泡的装置在不同的两个房间进行交流,以下是很简单能说明的一个模型: 你的房间有一个开关,另外一间房间有一 ...
- COGS 2188. [HZOI 2015] Math 题解
题目描述: 给定n个数X1-Xn,求下面式子的值(整数部分): n<=107,xi<=109且互不相同. 分析: 其实一开始看见这道题我也吓傻了,k这么大,再说我又是数论鶸渣,打死也不 ...
- AJAX 页面数据传递
$.ajax({ //一个Ajax过程 type: "post", //以post方式与后台沟通 url: "personstockajax.php", //与 ...
- django操作数据库之查询F,Q操作 和 seach搜索功能
# F 使用查询条件的值 # # from django.db.models import F # models.Tb1.objects.update(num=F('num')+1) # Q 构建搜索 ...