fontawesome图标字体库
fontawesome图标字体库通过css类可以让你使用众多的图表,堪称一个图标字体的css框架了。Font Awesome为您提供可缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。具体的有如下特点:
1.图标众多,现在的Font Awesome最新版本为4.7.0,包含了670多个图标,能满足日常使用了。
2.不依赖JavaScript
3.可缩放而不损失质量,因为这个图标库是矢量图标库
4.这些图标字体支持任何可用的css设置,你可以设置图表的font-size,color,shadow等
5.关键是免费
具体可参考其中文网站:http://fontawesome.dashgame.com/
截图如下:
使用方法:
1.在官网上下载之后是个压缩包,也可云盘下载,font-awesome-4.7.0.zip:https://pan.baidu.com/s/1Dv9E7aplMYc68FS-mhEpBQ
2.解压之后即可使用,简单的例子:
代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
|
说明:
font-awesome的图表都是以fa类 加上fa-图标名来展现,图标名可以在官网的首页中找到,首页中列出了所有的可用图标,如下红框框住的就是图标名字:
fa-fw:不是必须的,它的作用是使所有的图表保持同样的宽度,避免图标宽窄的问题,即fixed width的缩写(固定宽度),在列表的时候经常使用:
style中我重写了图表的font-size和color,目的就是为了告诉大家,font-awesome支持任何的css设置。