字体令人敬畏地显示亚洲标志而不是图标

Question

我正在尝试使用Font Awesome而不是任何图标，它只显示任何亚洲标志。我为web服务器下载了字体awsome。我在3种不同的浏览器（firefox，opera和chromium）中尝试过这种方法，但它总是一样的。

可在此处查看测试页：http://2weitweitweg.de/test.html

以下是它的截图：http://postimg.org/image/9yh5p0p97/

它是否在您的浏览器中显示标志？问题与浏览器或服务器有关吗？我该如何解决？

再见

Answer 1

我遇到了这个问题，原因是因为我使用旧的html和新的fontawesome版本。

我通过修改

来修复它

<i class="fa-bitbucket"></i>

以

<i class="fa fa-bitbucket"></i>

即。我只需要将默认的fa类添加到元素中。

最新版本使用fa前缀，但对您而言，我猜它可能是icon。

希望这可以在某个阶段帮助某人： - ）

Answer 2

很可能找不到实际的字体文件。如果您查看字体真棒CSS文件，您可能会看到如下内容：

@font-face {
  font-family: 'FontAwesome';
  src: url('../font/fontawesome-webfont.eot');
  src: url('../font/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
    [...etc]

这需要在CSS文件所在的同一级别找到名为font的文件夹中的字体文件。例如：

myproject / css
                 / font-awesome.css
                   [...etc]
          / font
                 / fontawesome-webfont.eot
                   [...etc]

如果文件位于正确的位置，可能是因为某些权限问题而未加载它们，甚至您使用的是一个不正确支持@ font-face的奇怪浏览器。当然，您可以通过浏览font awesome examples page来排除后者，看它是否正确显示图标。

Answer 3

和我一样，font-awesome可以在我的PC浏览器上运行[所有这些]，但我后来在移动java opera浏览器上测试了字体 - 真棒[最新的java手机浏览器浏览器] （确切地说是c2-03）]我只看到亚洲的标志/字符/符号，有时我看到的是盒子，而不是字体很棒的符号。我希望这会得到解决吗？

Answer 4

希望我不会太迟，服务器上的某些内容配置不正确，解决方案是允许像静态资源一样请求* .woff和* .tff，就像使用* .css和* .js一样，这取决于平台：

我做了什么让它发挥作用：

替换样式表（因为我们无法获取资源）：

<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.1/css/font-awesome.css" rel="stylesheet">

并替换了旧的icon- *类，例如：

<i class="fa-umbrella fa text-error"></i>

现在它起作用了：

Answer 5

如果您使用4.0或更高版本，他们已将icon类更改为fa类 所以你的代码应该说

    <i class="fa fa-camera-retro fa-large"></i>

而不是

    <i class="icon icon-camera-retro icon-large"></i>

您可以访问http://fontawesome.io/icons/并点击/点按所需的图标，找到图标，特定代码示例。

从3.2升级到4.0.3时，我遇到了同样的问题

Answer 6

运行以下命令

npx react-native链接react-native-vector-icons

Answer 7

使用fontawesone 5.15.1，我必须这样做才能显示Linux图标：

<i class="fab fa-linux icon"></i>

重要提示：由于Linux被认为是“品牌”，因此使用“ fab ”而不是“ fa”。