以前网页上显示图标都是用切成小图片，然后凭据差别场景作多个小图，通过JS来控制显示效果。 字图图标，顾名思义，就像使用通常的字体，可以设置字体颜色，巨细等，不用在搞多张小图片，异常天真。其优点：

• 轻松的界说图标的颜色，巨细，阴影，和任何与CSS相关的特征。
• 更快的载入速率、样式更容易界说。
• 使用矢量字体，这意味着他们可以完善的显示在高分辨率显示器中。

Iconfont

阿里巴巴矢量图标库，Iconfont-海内功效很壮大且图标内容很厚实的矢量图标库,提供矢量图标下载、在线存储、花样转换等功效。阿里巴巴体验团队倾力打造,设计和前端开发的便捷工具。

Iconfont平台为用户提供在线图标搜索、图标分捡下载、在线储存、矢量花样转换、小我私家图标库治理及项目图标治理等基础功效。 

网站： http://www.iconfont.cn/

Font Awesome

Font Awesome为您提供可缩放的矢量图标，您可以使用CSS所提供的所有特征对它们举行更改，包罗：巨细、颜色、阴影或者其它任何支持的效果。其特点：

网站：http://fontawesome.dashgame.com/

Github: https://github.com/FortAwesome/Font-Awesome/

Cikonss

Cikonss是行使纯CSS手艺构建的响应式、跨浏览器的icon，兼容IE8+。这意味着必须使用CSS2，因此，可以绘制的形状或图形就收到了限制。

某些icon必须有 border-radius 属性，这主要是为了在支持此属性的浏览器上更好的绘制icon，而且不会影响到不支持此属性的浏览器。

网站：http://www.bootcss.com/p/cikonss/index.html

Glyph Icons

Glyphicons Halflings需要商业允许，然则可以通过基于项目的Bootstrap来免费使用这些图标，Bootstrap捆绑了200多个字体图标。  

官网: http://glyphicons.com/

Simple Line Icons

一套线条异常优美的图标。

官网: https://thesabbir.github.io/simple-line-icons/

Github: https://github.com/thesabbir/simple-line-icons

Ionicons

一套线条异常优美的图标，今天为止大约有750多个字体图标，图标多，有尺度，iOS，Android，社交图标，图标异常优美。

官网: http://ionicons.com/

Github: https://github.com/driftyco/ionicons

Themify

Themify图标是用于网页设计和应用一套完整的图标，包罗320以上像素完善，手工制作的图标，画的灵感来自苹果iOS7公然，100%免费！

官网: http://themify.me/themify-icons

Material Design Iconic Font

有提醒，视频，联系，内容，编辑器，硬件，舆图等多种分类图标

官网: http://zavoloklom.github.io/material-design-iconic-font/index.html

Github: https://github.com/zavoloklom/material-design-iconic-font

Weather Icons

涵盖了与天气相关字体图标

官网: http://erikflowers.github.io/weather-icons/

链接: http://www.fly63.com/article/detial/1327