图标字体是目前一种比较流行的网页设计方式，相比于传统的图片格式有以下几个优势！
1. 你可以自由调整图标的尺寸而不用担心像素（产生锯齿）的问题2. 这类字体大部分都是开源的，所以图标种类丰富多样3. 任意修改图标颜色
4. 加载迅速，兼容性好，包括ie6浏览器
5. 调用非常方便
所以，作为网页前端开发者们视乎已经没有什么理由忽略它了，下面打算介绍一种调用网页图标字体的方法供大家使用。
要想使用这些图标，首先得找一个提供这类资源的网站，目前已经有很多网站专门提供这类资源，当然，如果你愿意花时间也可以自己设计。
weloveiconfonts是一个专门提供这类资源的网站，登陆后你就可以在种类繁多的图标字体中选择一组自己喜欢的了。
以entypo这组图标为例，点击add按钮后下方的use选项会变成高亮，继续点击就会出现使用方法。在css文件中粘贴一下代码
[class*=”entypo-“]:before {
font-family: ‘entypo’, sans-serif;
}
调用方法：
比如你要调用某一个图标如（email），直接点击该图标，在下方就会出现调用方式 entypo-mail，接下来在你的html结构中直接调用class类就行了。
如果你不想在css中插入该网站url http://weloveiconfonts.com/api/?family=entypo或者担心哪天网络被墙了，你还可以直接输入该网址下载该组图标字体。
输入网址后就将全部代码复制下来，新建一个css文件粘贴代码保存到css文件夹中用于调用。
以下仅复制了一部分不是全部
@font-face {
font-family: ‘entypo’;
font-style: normal;
font-weight: normal;
src: url(‘http://weloveiconfonts.com/api/fonts/entypo/entypo.eot’);
src: url(‘http://weloveiconfonts.com/api/fonts/entypo/entypo.eot?#iefix’
format(‘eot’),url(‘http://weloveiconfonts.com/api/fonts/entypo/entypo.woff’
format(‘woff’),url(‘http://weloveiconfonts.com/api/fonts/entypo/entypo.ttf’
format(‘truetype’),url(‘http://weloveiconfonts.com/api/fonts/entypo/entypo.svg#entypo’
format(‘svg’);}
然后再将entypo.eot、entypo.woff、entypo.ttf、entypo.svg这四种字体格式分别下载下来放到fonts文件夹中，字体下载在url中写得很清楚啦！
将css文件中的网址替换为本地的url路径即可
@font-face {
font-family: ‘entypo’;
font-style: normal;
font-weight: normal;
src: url(‘../fonts/entypo/entypo.eot’);
src: url(‘../fonts/entypo/entypo.eot?#iefix’) format(‘eot’),
url(‘../fonts/entypo/entypo.woff’) format(‘woff’),
url(‘../fonts/entypo/entypo.ttf’) format(‘truetype’),
url(‘../fonts/entypo/entypo.svg#entypo’) format(‘svg’);
}
网页图标字体确实是一种非常方便的资源，主要还是可以任意修改图标颜色，大小还不用担心变形，如果想要的图标都有的话甚至CSS Sprites已经不再需要了，节省了很多开发时间。(转自网络)
