9

我的基于 JSF 的页面有以下主模板文件：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
   xmlns:ui="http://java.sun.com/jsf/facelets"
   xmlns:h="http://java.sun.com/jsf/html"
   xmlns:f="http://java.sun.com/jsf/core"
   xmlns:p="http://primefaces.org/ui">
<h:head>
   <title><ui:insert name="title">MyApp</ui:insert></title>
   <h:outputStylesheet name="stylesheet.css" library="styles"/>
</h:head>

<h:body>

   <div id="container">
      <div id="header">
         <ui:insert name="header">
            // header content
         </ui:insert>
      </div>

      <div id="content">
         <ui:insert name="content">
         </ui:insert>
      </div>

      <div id="footer">
         <ui:insert name="footer">
         </ui:insert>
      </div>
   </div>
</h:body>

</html>

在头部部分，我们有stylesheet.css. 该样式表包含我所有页面通用的所有全局样式。

在模板客户端中，我想添加特定于页面的样式表。因此，我尝试在模板客户端页面中添加以下行：

<ui:composition template="/pages/templates/template.xhtml">
   <ui:define name="content">
      <h:outputStylesheet name="indexPage.css" library="styles" target="head"/>

      // body content

</ui:composition>

然而，这似乎并没有添加indexPage.css到生成的 HTML 的 head 部分中。

我正在使用 Mojarra 2.1.2。它支持target属性吗？我没有看到它被列为我在 Eclipse 中的自动建议选项中的可用选项之一。

如果没有，我如何在仍然使用模板的同时注入额外的页面特定 CSS？

4

2 回答 2

10

将新模板内容添加到您的主模板文件中，head专门用于css文件链接：

<h:head>
   <title><ui:insert name="title">MyApp</ui:insert></title>
   <h:outputStylesheet name="stylesheet.css" library="styles"/>
   <ui:insert name="css"/>
</h:head>

在模板客户端页面中添加页面特定样式表，如下所示：

<ui:composition template="/pages/templates/template.xhtml">
   <ui:define name="css">
      <h:outputStylesheet name="indexPage.css" library="styles"/>
   </ui:define>
   ...
</ui:composition>

而不是h:outputStylesheet可以使用<link rel="stylesheet" type="text/css" href="relative path to css file">。重要的是，主模板中ui:insert的css应该在h:head.

于 2014-10-06T10:14:07.890 回答
0

我刚遇到类似的问题，一位朋友帮助了我。解决方案是在 ui:composition 的子标题中导入 css

<ui:composition
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    template="/template.xhtml"
>
    <ui:define name="subheader">
        <h:outputStylesheet library="css" name="my-style.css" />
    </ui:define>

    <ui:define name="content">
    </ui:define>
    </ui:composition>
于 2017-10-19T13:31:23.980 回答