20

JSF/Facelets を使用するプロジェクトに取り組んでいます。View XHTML で CSS を変更したいのですが、Web アプリケーションを Tomcat サーバーにデプロイしても何も起こりません。私は多くのトリックを試しましたが、同じ結果が得られました。

とにかく、ここに私の「styles.css」があります:

body { width: 750px; }

#header 
{
width:              100%;
font-size:          36px;
font-weight:        bold;
line-height:        48px;
background-color:   navy;
color:              white;
}

#footer
{
width:              100%;
font-weight:        bold;
background-color:   navy;
color:              white;
}

そして、これは「Header.html」と「Footer.html」を含むメインテンプレート「Template.html」で、タグを使用して「styles.css」を配置します。

<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<h:outputStylesheet name="css/styles.css" />
    <!-- i've also tried this one, using the "library" attribute -->
    <!--
     <h:outputStylesheet library="css" name="styles.css" />
    -->
</head>
<h:body>
<h:panelGroup id="page" layout="block">

    <h:panelGroup id="header" layout="block">
        <ui:insert name="header">
            <ui:include src="Header.html" />
        </ui:insert>
    </h:panelGroup>

    <h:panelGroup id="container" layout="block">
        <h:panelGroup id="content" layout="block">
            <ui:insert name="content">CONTENT</ui:insert>
        </h:panelGroup>
    </h:panelGroup>

    <h:panelGroup id="footer" layout="block">
        <ui:insert name="footer">
            <ui:include src="Footer.html" />
        </ui:insert>
    </h:panelGroup>

</h:panelGroup>

</h:body>
</html>

Anf 最後に、テンプレート「Template.html」を含む「Main.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">
 <ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich" template="Template.html">
<h:body>
    <ui:define name="content">
        <h:form>
            <h:inputText title="inputText"></h:inputText>
            <h:commandButton value="OK"></h:commandButton>
        </h:form>
    </ui:define>
</h:body>
 </ui:composition>

前もって感謝します :)

4

2 に答える 2

56

(<h:outputStylesheet>および<h:outputScript>) には が必要<h:head>ですが、 があります<head>。それに応じて修正してください。

<h:head>
    <h:outputStylesheet name="css/styles.css" />
</h:head>

さらに、css/styles.cssファイルが/resourcesパブリック Web コンテンツのサブフォルダーに配置されていることを確認する必要があります。

WebContent
 |-- resources
 |    `-- css
 |         `-- styles.css
 :

この属性を使用しようとする試みに関しては、このコンテキストでは使用が完全に正しいわけではないlibraryことに注意してください。library="css"関連項目: JSF リソース ライブラリの目的と使用方法

于 2012-09-05T13:08:55.710 に答える
-4

リソースフォルダーをWebContentの下に追加します。

リソース内にcssフォルダーを作成します

次に、このようなファイルにアクセスします

h:outputStylesheet library="css" name="myNewStylesFile.css" target="head"h:head追加しなかったセクション の下

于 2015-07-18T06:11:46.697 に答える