Question

如何将一个favicon添加到JSF项目并在<link>元素中引用它？

我试过如下：

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

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

Answer 1

相对href相对于当前请求URI。可能它解决了无效的URL。您需要在上下文路径前加上它，使其相对于域根目录。

另外，rel最好是shortcut icon，以便在旧版浏览器中使用它。

如果使用.ico文件，您还需要确保它是真实 .ico文件，而不是某些.bmp重命名为{{1} }}。您可以根据多种图片格式生成一个here。但是，您也可以使用.ico或.png文件。

总而言之，只要文件位于

中

.gif

然后这应该这样做：

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

但是，如果您已将其作为JSF资源放在<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/images/favicon.ico"/>文件夹中，如下所示

/resources

这将使WebContent |-- resources | `-- images | `-- favicon.ico :可以访问它，然后应该这样做：

<h:graphicImage name="images/favicon.ico">

另见：

Answer 2

我使用了以下内容，它适用于IE和Chrome

<link rel="shortcut icon" href="#{resource['images/favicon.ico']}" type="image/x-icon" />

Answer 3

作为旁注，我在引用图标时总是包含这两个：

<link rel="shortcut icon" type="image/x-icon" href="https://a.staticimageserver.com/img/favicon.ico" />
<link rel="icon" type="image/x-icon" href="https://a.staticimageserver.com/img/favicon.ico" />

Answer 4

由于JSF使用资源作为存储图像文件文件夹的容器，因此您可以执行以下操作：

<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/resources/images/favicon.ico"/>

将favicon添加到JSF项目并在<link />中引用它

4 个答案:

另见：