我正在尝试将Font Awesome集成到JSF中。
<h:outputStylesheet library="font-awesome" name="css/font-awesome.min.css" />
字符串
但是浏览器找不到字体文件。它们显示为空方块:
的数据
我希望它们看起来像下面这样:
的
这是如何造成的,我该如何解决?
我正在尝试将Font Awesome集成到JSF中。
<h:outputStylesheet library="font-awesome" name="css/font-awesome.min.css" />
字符串
但是浏览器找不到字体文件。它们显示为空方块:
的数据
我希望它们看起来像下面这样:
的
这是如何造成的,我该如何解决?
6条答案
按热度按时间af7jpaap1#
默认情况下,Font Awesome CSS文件通过如下相对路径
../
引用这些字体文件:字符串
如果CSS文件本身在不同的路径上被请求,这将失败。如果您指定
library
属性,JSF<h:outputStylesheet>
将执行此操作。此外,JSF将为这些资源使用特殊的/javax.faces.resource/*
前缀模式,以便专门调用JSF资源处理程序,从而允许自定义自由。详细信息可在What is the JSF resource library for and how should it be used?中找到提供了如下的文件夹结构,
型
Font Awesome CSS包含如下:
型
然后,您需要编辑CSS文件,如下所示,以使用EL中的
#{resource}
Map来引用/resources
文件夹中具有适当库和资源名称的字体文件(由于库名称已经作为查询字符串参数结束,因此您还需要将?
替换为&
,如果您不使用库名称,则无需执行此操作)。型
确保在编辑CSS文件后重新启动服务器。在JSF资源处理程序第一次读取CSS文件时,某个CSS文件中的EL表达式只会被检测到一次,然后在应用程序范围内记住。
如果您在服务器日志中看到这些字体文件的JSF1091警告,如下所示:
错误:JSF1091:找不到文件[some font file]的mime类型。若要解决此问题,请将mime类型Map添加到应用程序web.xml。
然后,您需要相应地采取行动,将下面的mimeMap添加到
web.xml
:型
如果您碰巧使用JSF实用程序库OmniFaces,那么使用
#{resource}
Map编辑CSS文件的替代方法是安装OmniFacesUnmappedResourceHandler
并根据其文档重新配置FacesServlet
Map。您只需确保不再通过library
引用字体CSS文件:型
参见:
ijnw1ujt2#
PrimeFaces 5.11也有Font Awesome开箱即用
只需将此
context-param
添加到您的web.xml
:字符串
然后你可以这样应用Font Awesome图标:
型
参考文献:
jobtbby33#
我改变了路径“font-awesome.css”和工作正常
字符串
}
vlurs2pr4#
你只需要通过你的pom.xml手动包含它:
字符串
然后包括这两个CSS样式表(在模板中执行以在每个页面中加载它们)以启用它:
型
lf5gs5x25#
我改变了oet的路径,ttf,svg,woff文件在“font-awesome.min.css”文件像这样:
字符串
它的工作对我来说很好,但我仍然在寻找另一种解决方案,因为我应该有一个动态的路径,而不是像
"http://localhost:8080/Students_manager/..."
静态6gpjuf906#
与BalusC的答案相同,但有一些变化。注意:我正在集成Metronic主题。
字符串
simple-line-icons.min.css
也是如此。正如BalusC所说,通过在他的答案中添加行来添加变化
web.xml
。的数据