没有此代码，Fontawesome无法正常工作

Question

每次我都想使用fontawesome时，都必须将此样式添加到页面：

<style>
* {
    font-family: fontawesome !important;
}
</style>

如果不是，则只显示一个空白方块，但是我不能使用其他字体  解决方案我可以使用fontawesone，但不必定义它？

Answer 1

此解决方案与Font Awesome 5有关。有两种方法可以应用Font Awesome图标。在下面的代码片段中，我已经显示了它们。您需要链接字体很棒的新库，否则它将无法正常工作。

.fa {
  font-family: "Font Awesome 5 Free";  /* updated font-family */
  font-weight: 900; /* regular style/weight */
}

.my-camera::before {
  font-family: "Font Awesome 5 Free";  /* updated font-family */
  font-weight: 900; /* regular style/weight */
  content: "\f083";
  font-style:normal;
}

<link href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" rel="stylesheet"/>




<i class="fas fa-camera-retro"></i> <!-- version 5's syntax -->

<br>

<i class="my-camera"></i> <!-- version 5's syntax -->

https://jsfiddle.net/Sampath_Madhuranga/sjn5Lek2/5/

Answer 2

.fa, .far, .fas {
    font-family: "Font Awesome 5 Free";
}

尝试一下，他们更改了字体系列名称。