1、一句话将Font Awesome加入您的网页中。您完全不用下载或者安装任何东西!
2、将以下代码粘贴到网页HTML代码的 <head> 部分。
"//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">3、参考示例,然后开始使用Font Awesome吧!
1、复制整个font-awesome 文件夹到您的项目中。
2、在HTML的 <head> 中引用font-awesome.min.css。
"path/to/font-awesome/css/font-awesome.min.css" rel="stylesheet">3、参考示例,然后开始使用Font Awesome吧!
<i> ,因为它更简洁。 但实际上使用 <span> 才能更加语义化。
"fa fa-camera-retro"></i> fa-camera-retro fa-fw 可以将图标设置为一个固定宽度。主要用于不同宽度图标无法对齐的情况。 尤其在列表或导航时起到重要作用。
"fa fa-home fa-fw"></i> fa-home"fa fa-book fa-fw"></i> fa-book"fa fa-pencil fa-fw"></i> fa-pencil"fa fa-cog fa-fw"></i> fa-cog fa-spin 类来使任意图标旋转,现在您还可以使用 fa-pulse 来使其进行8方位旋转。尤其适合 fa-spinner、fa-refresh和 fa-cog。
"fa fa-spinner fa-spin"></i> fa-spinner"fa fa-circle-o-notch fa-spin"></i> fa-circle-o-notch"fa fa-refresh fa-spin"></i> fa-refresh"fa fa-cog fa-spin"></i> fa-cog"fa fa-spinner fa-pulse"></i> fa-spinner fa-stack 类作为父容器, fa-stack-1x 作为正常比例的图标, fa-stack-2x 作为大一些的图标。还可以使用css样式切换图标颜色。您可以在父容器中通过添加大图标类来控制整体大小。
"fa-stack fa-lg">"fa fa-square-o fa-stack-2x"></i> "fa fa-twitter fa-stack-1x"></i> "fa-stack fa-lg">"fa fa-camera fa-stack-2x"></i> "fa fa-ban fa-stack-1x" style="color:#a94442;"></i>