如何将Favicon添加到JSF项目并在<link>元素中引用它?

我尝试如下:

<h:head>
    <link rel="icon" type="image/x-icon" href="images/favicon.ico"/>
    ...
</h:head>

但是,它没有显示任何图标。

最佳答案

相对href相对于当前请求URI。它可能解析为无效的URL。您需要在上下文路径之前添加前缀,以使其相对于域根目录。

另外,rel最好是shortcut icon,以使其也可以在较旧的浏览器中使用。

如果使用.ico文件,则还需要确保它是实际 .ico文件,而不是某些重命名为.bmp.ico。您可以基于多种图像格式生成一个here。但是,您也可以只使用.png.gif文件。

总而言之,只要文件位于

WebContent
 |-- images
 |    `-- favicon.ico
 :

然后应该这样做:
<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/images/favicon.ico"/>

但是,如果将其作为JSF资源放置在/resources文件夹中,则如下所示

WebContent
 |-- resources
 |    `-- images
 |         `-- favicon.ico
 :

这将使它可以通过<h:graphicImage name="images/favicon.ico">进行访问,那么应该做到这一点:
<link rel="shortcut icon" type="image/x-icon" href="#{resource['images/favicon.ico']}"/>

也可以看看:
  • Wikipedia - Favicon
  • How to reference CSS / JS / image resource in Facelets template?
  • 关于html - 将Favicon添加到JSF项目并在<link>中引用它,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/5978684/

    10-12 12:53
    查看更多