字体真棒不显示JSF应用程序中的所有图标[重复]答案

【问题标题】：Font awesome does not show all icons in JSF app [duplicate]字体真棒不显示JSF应用程序中的所有图标[重复]
【发布时间】：2015-08-28 13:01:55
【问题描述】：

我想在我的 jsf 应用程序中使用 font awesome，但不幸的是，某些图标似乎没有显示。我只能看到一个方形符号，而不是图标。

我的 jsf 页面如下所示：

<div class="centerbox" style="bottom: 5mm; top: 5mm;">
    <i class="fa fa-chain fa-5x"></i>
    <i class="fa fa-wheelchair fa-5x"></i>
    <h:outputLabel value="#{msg.systemNotAvailable}" />
    <a href="tel:xyz" class="mobi-button mobi-button-attention"><h:outputText value="Allocation"/></a>
  </div>

我包含的css文件如下：

<h:outputStylesheet name="font-awesome.css" library="css" media="screen"/>

奇怪的是，fa-chain 图标显示正确，但轮椅图标不正确。

当我查看 html 并更改图标的代码时，似乎有几个图标不起作用。

我在最新版本 4.4.0 上尝试过这个

有没有其他人遇到这个问题或者可以给我提示如何解决？

【问题讨论】：

你用cdn试过了吗？ maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/…
如果客户端出现任何故障，请始终在浏览器的控制台中查找线索。在 Chrome/Firefox23+/IE9+ 中按 F12 并打开 Console 选项卡。将未修改的特定错误消息复制粘贴到健全的搜索引擎的输入字段中通常已经给出了答案。
这根本与 jsf 和 jsf-2.2 无关。 JSF 在这方面只是一个 html 生成器。而且您甚至没有 jsf 标签上的图标。所以我敢打赌，如果你删除 h:outputLabel 和 h:outputText 并直接加载 css，而不是通过 h:outputStylesheet。

标签： html css jsf font-awesome jsf-2.2

【解决方案1】：

您始终可以使用 MaxCDN 的实时 css，例如： http://jsfiddle.net/web_nfo/zfdgna5w/

https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css

（来源：https://fortawesome.github.io/Font-Awesome/get-started/#bootstrapcdn）

可能字体文件（fontawesome-webfont.eot、fontawesome-webfont.woff2 等）未正确加载。在 css 中有一些相对路径，如果您的（本地）服务器上没有字体，则它不起作用。

【讨论】：

【解决方案2】：

首先感谢您的回复。我认为问题在于，字体文件安装在 webapp 的资源文件夹中。因为我把它放到了WebContent-root中，所以所有的图标都可以显示出来了。

非常感谢您的支持:-)

【讨论】：