时间戳

首页 > 解决方案 > 没有此代码，Fontawesome 将无法工作

html - 没有此代码，Fontawesome 将无法工作

问题描述

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

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

如果不是它只显示一个空白方块，但这样做我不能使用另一种字体，我可以使用 fontawesone 但不必定义它的任何解决方案？

标签： htmlcssfont-awesome-5

解决方案

这个解决方案是关于 Font Awesome 5 的。有两种应用字体真棒图标的方法。在下面的片段中，我已经展示了它们。您需要链接字体真棒新库，否则将无法正常工作。

.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/

推荐阅读