Question

尝试使用JSF2模板功能.base.xhtml页面如下所示

 <?xml version="1.0" encoding="UTF-8"?>
    <!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:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
    >

    <h:head>
    <h:outputStylesheet name="test.css" library="style" target="head"/>
    </h:head>

    <h:body>

    <div id="page">
    <div id="header">
    <ui:insert name="header" >
    <ui:include src="/layout/header.xhtml" />
    </ui:insert>
    </div>

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

    <div id="footer">
    <ui:insert name="footer" >
    <ui:include src="/layout/footer.xhtml" />
    </ui:insert>
    </div>

    </div>

    </h:body>
    </html>

尝试将此模板继承到我的页面（testpage.xhtml）

   <?xml version="1.0" encoding="UTF-8"?>
   <!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:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      >
    <h:body>

    <ui:composition template="/layout/base.xhtml">
    <ui:define name="content">
    Default Page content!!!!
    <h:outputText value="Foo bar" style="green"/>
    </ui:define>

    </ui:composition>

    </h:body>

    </html>

test.css文件位于webcontent / resources / style文件夹下，css文件的内容如下：

.green{
color:#0000FF;      
}

现在的问题是，当我尝试运行testpage时，样式表正在添加到页面中（视图源能够识别），但它没有反映在UI中。

上面的代码有什么问题吗？对此有任何帮助表示赞赏。

Answer 1

您应该使用styleClass属性（相当于普通HTML的class属性）

替换

<h:outputText value="Foo bar" style="green"/>

用

<h:outputText value="Foo bar" styleClass="green"/>

jsf2模板并添加样式表

1 个答案: