使用xpages的字体awesome即使在加载后也不会生效

我在xpages中使用了字体awesome。我有一个名为securePolling的主题，在这个主题中我提供了到资源的链接 securePolling中的代码是

<theme extends="webstandard" xmlns:xsi="http://www.w3.org/2001/XMLSchema- instance"  xsi:noNamespaceSchemaLocation="platform:/plugin/com.ibm.designer.domino.stylekits/ schema/stylekit.xsd" >

<resource rendered="#{javascript:context.getProperty('xsp.resources.aggregate').equals('true')}">
    <content-type>text/css</content-type>
    <href>font-awesome-fontFamily.css</href>
</resource>
<resource rendered="#{javascript:context.getProperty('xsp.resources.aggregate').equals('true')}">
     <content-type>text/css</content-type>
     <href>font-awesome-4.2.0/font-awesome-4.2.0/css/font-awesome.min.css</href>
</resource> 

完成所有这些操作后，我可以在浏览器调试工具中检查，它显示font-awome.css已加载，但字体对ant图标无效， 这是一张更清晰的图片

经过一些研究，我们还尝试将font-awome.css代码更改为

 @font-face {
 font-family: "FontAwesome";
 src: url('font/fontawesome-webfont.eot');
 src: url('font/fontawesome-webfont.eot?#iefix') format('eot');
 src: url('font/fontawesome-webfont.woff') format('woff');
 src: url('font/fontawesome-webfont.ttf') format('truetype');
 src: url('font/fontawesome-webfont.svg#FontAwesome') format('svg');
 font-weight: normal;
 font-style: normal;
 }

任何帮助都将不胜感激

---

当聚合更改为“false”时，它工作得非常好，但当它为“true”时，它不会生效。这是更改为“true”后的图像结果和控制台。

我认为css应该如下所示。但请注意，此处的相对URL仅在禁用聚合的情况下工作：

@font-face {
    font-family: "FontAwesome";
    src: url('../font/fontawesome-webfont.eot');
    src: url('../font/fontawesome-webfont.eot?#iefix') format('eot');
    src: url('../font/fontawesome-webfont.woff') format('woff');
    src: url('../font/fontawesome-webfont.ttf') format('truetype');
    src: url('../font/fontawesome-webfont.svg#FontAwesome') format('svg');
    font-weight: normal;
    font-style: normal;
}

还有，它们肯定在一个名为“字体”的文件夹中吗？通常，它们位于字体下载中名为“字体”的文件夹中

启用聚合后，您需要不同的相对URL：

@font-face {
    font-family: "FontAwesome";
    src: url('../../../font/fontawesome-webfont.eot');
    src: url('../../../font/fontawesome-webfont.eot?#iefix') format('eot');
    src: url('../../../font/fontawesome-webfont.woff') format('woff');
    src: url('../../../font/fontawesome-webfont.ttf') format('truetype');
    src: url('../../../font/fontawesome-webfont.svg#FontAwesome') format('svg');
    font-weight: normal;
    font-style: normal;
}

因此，您可能需要创建两个版本的字体可怕的css文件，一个在聚合关闭时加载，另一个在聚合打开时加载。或者有一个版本使用绝对URL而不是相对URL

---

还要注意，font awesome附带了一个“.css”文件和一个最小化版本“.min.css”，因此一定要根据需要更改这两个版本。

上述问题背后的实际原因是“.css”文件中给出的指向字体文件的路径，这些文件位于font目录中

现在从一开始我们就可以看到“.theme”文件代码，其中的资源路径是“font-awesome-4.2.0/font-awesome-4.2.0/css/font-awesome.min.css”

当我推迟聚合时，代码如下所示

@font-face {
font-family: "FontAwesome";
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.eot');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.eot?#iefix') format('eot');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.woff') format('woff');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.ttf') format('truetype');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.svg#FontAwesome') format('svg');
font-weight: normal;
font-style: normal;
}

作为参考，文件夹结构现在是

---

这个解决方案彻底解决了我的问题

很抱歉，我删除了评论，因为当我尝试使用聚合时遇到了相同的问题。浏览器开发工具的控制台中是否有错误？当我禁用聚合时，它工作得非常好。但是当它变为true时，它的行为与上面的图中相同。您是否按照我的建议创建了两个版本的CSS文件，或者切换到使用绝对URL？尝试将压缩模式更改为“无”，以查看导致问题的原因。字体文件是否已成功找到并加载到网络选项卡中，聚合为？Thanx to Brian Gleeson，答案和注释都帮助我解决并完成了它。基本上，我没有正确获取字体文件。

 <resource rendered="#{javascript:context.getProperty('xsp.resources.aggregate').equals('true')}">
 <content-type>text/css</content-type>
 <href>font-awesome-4.2.0/font-awesome-4.2.0/css/font-awesome.min.css</href>

@font-face {
font-family: "FontAwesome";
src: url('font-awesome-4.2.0/font/fontawesome-webfont.eot');
src: url('font-awesome-4.2.0/font/fontawesome-webfont.eot?#iefix') format('eot');
src: url('font-awesome-4.2.0/font/fontawesome-webfont.woff') format('woff');
src: url('font-awesome-4.2.0/font/fontawesome-webfont.ttf') format('truetype');
src: url('font-awesome-4.2.0/font/fontawesome-webfont.svg#FontAwesome') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: "FontAwesome";
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.eot');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.eot?#iefix') format('eot');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.woff') format('woff');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.ttf') format('truetype');
src: url('../../font-awesome-4.2.0/font/fontawesome-webfont.svg#FontAwesome') format('svg');
font-weight: normal;
font-style: normal;
}