许多朋友看到演示站的菜单有图标，不管是显示还是美观都有一定的效果，在这里，我介绍一下如何添给菜单添加fontawesome图标，也就是经常说的 fa fa图标。
当主题支持时直接引用
现在有好多主题都已经支持使用fontawesome图标了，开发者已经将使用图标时需要调用的库文件添加到源代码中，这个时候只需要在需要显示图标的地方添加如下代码即可：
<span><i class="fa fa-home"></i> 首页</span>- 图标代码是用<span>标签包裹起来的，这样会避免个别情况下不对齐问题
- </i> 后面，有一个空格，这样做的原因是图标和文字不会太拥挤
- 具体要用什么图标，可以到fontawesome官网去查找即可，将自己喜欢的图标代码替换即可
- <span><i class=”fa fa-图标代码”></i> 菜单名称</span>
当主题不支持时
当主题默认不支持添加图标时，我们就需要手动引入这个图标库，引入图标库后就可以像上面说的一样，直接插入图标。
方法1：BootstrapCDN
将以下代码粘贴到网页HTML代码的 <head> 部分
<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">方法二：使用默认CSS
复制整个 font-awesome 文件夹到您的项目中。
在HTML的 <head> 中引用font-awesome.min.css
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">代码说明
默认的添加图标的代码是：
<i class="fa fa-图标代码"></i>我们可以自定义图标的大小：
<i class="fa fa-图标代码 fa-lg"></i> fa-lg
<i class="fa fa-图标代码 fa-2x"></i> fa-2x
<i class="fa fa-图标代码 fa-3x"></i> fa-3x
<i class="fa fa-图标代码 fa-4x"></i> fa-4x
<i class="fa fa-图标代码 fa-5x"></i> fa-5x更多进阶教程可以到官网进行了解