在网页设计中使用图标字体（icon font）是件挺有新意的事情，使用图标字体能我们带来了一定的方便，比如在移动设备、Retina屏幕效果展示、兼容IE6/7浏览器以及能任意将图标放大缩小等，这些都是很不错的。
流行的在线字体定制网站有Fontello和icomoon，这两个在线工具都很不错的，内置的图标也非常的多
打开icoMoon APP字体定制页面，然后你会看到几百个常用图标，这里不建议全选，选几个你需要的就可以了，然后点击底部的“Font”按钮 –> 点击“Download”即可下载字体

喜欢自己原创，当然也是可以滴，准备工具：Fontlab、Adobe Illustrator。

1. Fontlab:
直接在Fontlab上制作图标字体，完成后点击Fire(文件) –> Export(导出) –> EPS格式。

2. AI:
打开刚刚导出的EPS，另存为SVG格式。

3.iconMoon APP
在icoMoon APP页面点击import Icons按钮，支持多选，然后按上文的方法下载使用即可！

Tips: Fontlab和AI这两个工具的路径是可以相互复制的哦，所以我们用AI来制作ICON方便一些，制作完再复制到Fontlab上，需要注意的是在AI里面的路径画大一点再复制到Fontlab里，否则容易变形。

 
 
http://sc.chinaz.com/info/130228237055.htm 这个地址是简介地址

https://icomoon.io/app/#/select  图标制作地址

iocfont 网页图标字体以及使用方法的更多相关文章

  1. Web字体工具整理，网页图标字体以及使用方法整理

    常用网站app logo 下载: http://www.iconfont.cn/collections/show/268?spm=a313x.7781069.0.0.nDYawz 1.Web字体免费生 ...

  2. ExtJs5_使用图标字体来美化按钮

    sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...

  3. 5、手把手教你Extjs5(五)使用图标字体来美化按钮)

    sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...

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

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

  5. 图标字体(IconFont)制作

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

  6. 老爷车IE8如何兼容图标字体

    前言 首先这个标题再详细的说就是如何解决font-face在IE8下间歇性出现图标字体渲染失败的解决方案. 如果你还不知道什么是图标字体,可以先阅读:链接1,链接2,链接3 先看在IE8下的问题: 而 ...

  7. 图标字体的使用(fontello.com)字体推荐及使用技巧

    网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...

  8. (转载)app ico图标字体制作

    图标字体化浅谈   在做手机端Web App项目中,经常会遇到小图标在手机上显示比较模糊的问题,经过实践发现了一种比较好的解决方案,图标字体化.在微社区项目中,有很多小的Icon(图标),如分享.回复 ...

  9. 01_MUI之Boilerplate中：HTML5示例，动态组件，自定义字体示例，自定义字体示例，图标字体示例

     1安装HBuilder5.0.0,安装后的界面截图如下: 2 按照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上图的 ...

随机推荐

  1. 《Spring敲门砖之基础教程第一季》 第一章 概要介绍

    百度百科say: Spring是一个开源框架,Spring是于2003 年兴起的一个轻量级的Java 开发框架,由Rod Johnson创建.简单来说,Spring是一个分层的JavaSE/EEful ...

  2. 使用ffmpeg录音

    官方教程:http://ffmpeg.org/ffmpeg.html 录音方法: 开始找到了这个方法,但是不行呀,好像是没有这个oss吧. oss 是linux 下的声音相关的东西,与alsa 一样, ...

  3. 公众号的秘密，知道一个biz就够了

    公众号的秘密,知道一个biz就够了 微信对于我来说,最有价值的是一个学习渠道,特别是搜狗微信搜索(http://weixin.sogou.com/)能够很方便的搜索公众账号和文章内容,PC端就能够获得 ...

  4. 深入研究MiniMVC之后续篇

    今天在园子看到<深入研究 蒋金楠(Artech)老师的 MiniMvc(迷你 MVC),看看 MVC 内部到底是如何运行的>之后,本来是不打算开博来续这个后传,不过,在那边回了个评论之后, ...

  5. PHP面向对象的构造方法与析构方法

    构造方法与析构方法是对象中的两个特殊方法,它们都与对象的生命周期有关.构造方法时对象创建完成后第一个被对象自动调用的方法,这是我们在对象中使用构造方法的原因.而析构方法时对象在销毁之前最后一个被对象自 ...

  6. CSAPP--优化程序性能

    一.编写高效的程序: 1.选择合适的算法和数据结构. 2.编写出编译器能够有效优化以转换为高效可执行的源代码. 3.并行计算.当然重点还是第一个,良好的算法和数据结构大大减小了程序的时间复杂度. 二. ...

  7. contentInset，contentsize和contentOffset区别

    contentInset,contentsize和contentOffset区别   今天看别人用到了contentInset,觉得很迷糊,于是gogle了一下,搜到了一篇分析的很好的文章,转在这里, ...

  8. cf B. Two Heaps

    http://codeforces.com/contest/353/problem/B 题意:要把2*n个两位数分成两部分,使得第一部分上的数和第二部分上的两位数组成四位数.求怎么分能使构成的不同的四 ...

  9. C++中new和delete的背后（ call edx 调用虚表内的第二个函数（析构函数））

    关于 C++中new背后的行为, 以前已经写过一篇了 理解C++中new背后的行为, 但是里面也只是泛泛而谈,没有真凭实据, 下面我们从汇编的角度看C++编译器究竟在背后干了什么?   我们的代码很简 ...

  10. BZOJ1108: [POI2007]天然气管道Gaz

    1108: [POI2007]天然气管道Gaz Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 410  Solved: 211[Submit][Sta ...