Font Awesome介绍
Font Awesome一套绝佳的图标字体库和CSS框架
Font Awesome是一款很流行的字体图标工具。随着Bootstrap的流行而逐渐被人所认识,现在FontAwesome不仅仅可以在bt上使用,还可以应用在各种web前端开发中。相对于传统的使用背景图片作为图标,字体图标主要是支持自适应、可以使用字体的各种特性(比如变色、变大变小、字体阴影等)、减少数据加载、样式更容易定义等。
Font Awesome 特性
- 一个字体文件, 369 个图标。
- 不需要JavaScript要求:更快的载入速度
- 无限的可扩展性:可伸缩矢量图形意味着每一个图标在任何大小看起来真棒。
- 自由免费:你可以将它应用到你的商业中。
- CSS控制:轻松的定义图标的颜色,大小,阴影,和任何与CSS相关的特性。
- 完美的视网膜显示:使用矢量字体,这意味着他们可以完美的显示在高分辨率显示器中
- 为BootStrap而生:完全的兼容BootStrap新版3.0
- 桌面友好:你可以查看字体的样式列表
- 兼容屏幕阅读器:不像其他字体图标不兼容屏幕阅读器
Font Awesome的使用
方法1:CDN
直接在 html 文档头部引用 CDN 文件即可。
直接搜索最新可用的资源
方法2:下载使用
1)下载解压文件,包括css和fonts文件夹:css文件夹中有两个css文件(font-awesome.css和font-awesome.min.css),fonts下有有5个。
2)拷贝到项目中
3)引入样式文件,如下:
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
4)使用
<a href="#"><i class="fa fa-cog fa-fw"></i> Settings</a>
资源:
https://fontawesome.dashgame.com/
Font Awesome 中文网:
http://caibaojian.com/fontawesome/get-started.html
https://www.bootcss.com/p/font-awesome/
https://github.com/FortAwesome/Font-Awesome
使用:
然重视此中的src:url()中的路径是不是当前与当前项目标实际路径向匹配。
4.最后在页面中参加响应的html元素,并且遵守font awesome定义好的样式为须要添加矢量图标的元素指定样式。:
别的,font awesome 和BootStrap连络可以达到更好的结果。