如何引入font-awesome

发布网友发布时间：2022-04-21 17:39

共1个回答

热心网友时间：2022-04-19 22:33

如何才能将如此绝佳的Font Awesome Icons引用到自己的网页上呢？下面做详细介绍。
最简单的方式：BootstrapCDN （由MaxCDN提供）
一句话将Font Awesome加入您的网页中。您完全不用下载或者安装任何东西！将以下代码粘贴到网页HTML代码的 <head> 部分.
<link href="//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">
简单方式之一：使用默认CSS
如果您使用了默认的Bootstrap CSS样式，那么你可以使用这种方式来引入默认的Font Awesome CSS样式。
复制整个 font-awesome 文件夹到您的项目中。
在HTML的 <head> 中引用font-awesome.min.css。
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
简单方式之二：LESS Ruby Gem
自行安装：$ gem install font-awesome-sass
进阶方式：自定义 LESS 或 SASS
将Font Awesome字体库下载到你的网站服务器中，在HTML的 <head> 中引用font-awesome，此时你就可以在任何地方以下面这种简单方式引用图标：
<i class="fa fa-camera-retro"></i>
还可以使用 fa-border 以及 pull-right 或 pull-left、fa-spin等指令制造出旋转、边框等特效。