Font Awesome怎么用?css网页图标的使用方法

  • Font Awesome怎么用?css网页图标的使用方法已关闭评论
  • 2,181 views
  • A+
所属分类:网站设计
2023阿里云优惠活动

阿里云:2核4G服务器6M带宽68元/年、2核4G服务器188元一年、4核8G5M 1000元、8核16G5M...
腾讯云:2核4G服务器8M带宽70元一年,更多1c2g/2c4g/2c8g/4c8g/8c16g/16c32g...

Font Awesome是一种很流行的CSS网页图标工具,随着自适应网站的发展,Font Awesome被应用到了各种web前端开发中。新手站长网来说说如何使用Font Awesome。

Font Awesome的使用方法:
1、下载Font Awesome,点我下载Font Awesome
2、下载后解压,我们只需要两个文件夹,即“css”和“font”这两个文件夹即可,如下图所示:

Font Awesome怎么用?css网页图标的使用方法

Font Awesome的使用方法

3、上传“css”和“font”这两个文件夹,注意:这两个文件夹要在同一目录下;
4、在网页中引用“font-awesome.min.css”
注意:路径正确。
5、使用<i class="fa fa-bars">我是图标后面的文字</i>

Font Awesome的优势:
1、支持自适应;
2、可以使用字体的各种特性(比如变色、变大变小、字体阴影等);
3、减少数据加载,可以提高页面的加载速度;
4、样式更容易定义等;
5、一个字体文件,369 个图标,一直在更新,现在应该更多了;
6、不需要javascript要求;
7、无限的可扩展性:可伸缩矢量图形意味着每一个图标在任何大小看起来真棒.SVG技术.
8、自由免费:你可以将它应用到你的商业中。
9、完美的视网膜显示:使用矢量字体,这意味着他们可以完美的显示在高分辨率显示器中
10、为BootStrap而生:完全的兼容BootStrap新版3.0

阿里云代金券免费领取