Font Awesome 图标无法通过 cdn.fontawesome.com 呈现

Question

我正在尝试让 Font Awesome 图标在我的网站上运行，但我遇到了提供给我的 JS 文件的问题。我去了 https://cdn.fontawesome.com/，并为自己生成了一个代码，但是当我 link 到它时，图标不起作用。我过去使用过 FA，使用 CSS 或开发工具包。这是一个示例 HTML 页面，其中包含特定于此 post:

的嵌入代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>FA Example</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://use.fontawesome.com/31263fc466.js"></script>
  </head>
  <body>
    <p style="text-align: center;">
      <code>fas fa-chevron-down</code>
      <i class="fas fa-chevron-down"></i>
    </p>
  </body>
</html>

我看到一个 Unicode F078 字符，这是正确的，但我的浏览器没有呈现图标。

早些时候，我看到了这个错误：CORS-Missing-Allow-Origin，但是当我安装一个浏览器扩展以允许所有请求时它就消失了（只是为了 localhost；我知道在我的用于生产的 Nginx 配置）。我不确定这是否与错误相关，但我想我会提到它，因为我没有在其他 link 或 script 标签中看到它

另外，让我知道它在您这边是否正确呈现。感谢任何帮助。

Answer 1

你的问题你的版本不包含 fas 它包含 fa

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>FA Example</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://use.fontawesome.com/31263fc466.js"></script>
  </head>
  <body>
    <p style="text-align: center;">
      <code>fas fa-chevron-down</code>
      <i class="fa fa-chevron-down"></i>
    </p>
  </body>
</html>

使用 fas 使用这个库

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>FA Example</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://kit.fontawesome.com/a076d05399.js"></script>
  </head>
  <body>
    <p style="text-align: center;">
      <code>fas fa-chevron-down</code>
      <i class="fas fa-chevron-down"></i>
    </p>
  </body>
</html>

Font Awesome 图标无法通过 cdn.fontawesome.com 呈现

Font Awesome icons not rendering via cdn.fontawesome.com

html

font-awesome