Java JSF2.0中重新加载时未应用的模板和样式
我刚刚开始使用JSF2.0,遇到了一个受到热烈欢迎的问题。 我使用了模板和模板客户端,并将CSS(应该提到我不是CSS专家)样式应用于模板文件。当我运行应用程序时,一切正常,但当页面被提交或重新加载或导航到另一个页面时,按下页面上的任何链接或按钮,不会应用任何样式,只会显示纯HTML。 我怎样才能克服这个问题 模板文件:Java JSF2.0中重新加载时未应用的模板和样式,java,css,templates,jsf,jsf-2,Java,Css,Templates,Jsf,Jsf 2,我刚刚开始使用JSF2.0,遇到了一个受到热烈欢迎的问题。 我使用了模板和模板客户端,并将CSS(应该提到我不是CSS专家)样式应用于模板文件。当我运行应用程序时,一切正常,但当页面被提交或重新加载或导航到另一个页面时,按下页面上的任何链接或按钮,不会应用任何样式,只会显示纯HTML。 我怎样才能克服这个问题 模板文件: <html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/fa
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="resources/css/default.css" rel="stylesheet" type="text/css" />
<link href="resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
<title>
<ui:insert name="title">Facelets Template</ui:insert>
</title>
</h:head>
<h:body>
<div id="top" class="top">
<ui:insert name="top">Top</ui:insert>
</div>
<div id="left">
<ui:insert name="left">left</ui:insert>
</div>
<div id="content" class="left_content">
<ui:insert name="content">Content</ui:insert>
</div>
</h:body>
</html>
谢谢,尝试将
css/图像/模板的链接从相对路径更改为绝对路径
例如:
发件人:
致:
#{facesContext.externalContext.requestContextPath}
将被替换到根目录
另见:
尝试将css/图像/模板的链接从相对路径更改为绝对路径
例如:
发件人:
致:
#{facesContext.externalContext.requestContextPath}
将被替换到根目录
另见:
您不应该使用
,而应该使用
。它的name
属性采用相对于/resources
文件夹的路径,您无需担心上下文路径
您不应该使用
,而应该使用
。它的name
属性采用相对于/resources
文件夹的路径,您无需担心上下文路径
请出示再现问题的代码谢谢,这是代码。我只是在这里省略了文档上方的一些xml标记。我应该提到的是,这里出现了一些额外的空格,而原始代码中不存在这些空格。请显示重现问题的代码谢谢,这是代码。我只是在这里省略了文档上方的一些xml标记。我应该提到一些额外的空格出现在这里,并且在原始代码中不存在。我想知道一些原因。你能提供更多的信息或链接作为参考吗?@ali honarmand-我在我的答案中添加了一个链接,可以帮助你理解。这种笨拙的方法可以通过{request.contextPath}
来实现。我想知道一些原因。你能提供更多的信息或链接作为参考吗?@ali honarmand-我给我的答案添加了一个链接,可以帮助你理解。这种笨拙的方法可以通过{request.contextPath}
来实现。根据这个答案,他应该做什么?根据这个答案,他应该做什么?
"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">
<body>
<ui:composition template="./../templates/TutorialsStructure.xhtml">
<ui:define name="title">
Start
</ui:define>
<ui:define name="top">
<h:graphicImage value="Image/butterfly.gif" style="alignment-adjust: central"/>
</ui:define>
<ui:define name="left">
</ui:define>
<ui:define name="content">
<h:form>
<div>
<p>
<div>
<h:outputLabel id="outputlabel_userName" for="inputText_userName" >
<h:outputText id="output_userName" value="UserName: "/>
</h:outputLabel>
</div>
<div>
<h:inputText size="35" id="inputText_userName" value="# {inputOutputBean.userName}"/>
</div>
</p>
<p>
<div>
<h:outputLabel id="outputlabel_password" for="inputsecret_password">
<h:outputText id="output_password" value="Password: "/>
</h:outputLabel>
</div>
<div>
<h:inputSecret id="inputsecret-password"
value="#{inputOutputBean.password}"
required="true"
requiredMessage="This Field is obligatory."
size="35">
</h:inputSecret>
</div>
</p>
<div id="submitBtn">
<h:commandButton value="Submit" id="submitBtn"/>
</div>
</div>
<div id="results_output" styleClass="results">
<div>
<h:outputLabel id="label_userName" styleClass="userNameResult" for="userNameResult"
value="User Name: "
style="height: 500px; padding: 2em 2em 2em 2em"/>
<h:outputText value="#{inputOutputBean.userName}" id="userNameResult" >UserName Value:</h:outputText>
</div>
<div>
<h:outputLabel id="outputlabel_password_res"
value="Password Value: " for="output_password_res"
style="height: 500px; padding: 2em 2em 2em 2em"/>
<h:outputText value="#{inputOutputBean.password}" id="output_password_res"/>
</div>
</div>
</h:form>
</ui:define>
</ui:composition>
</body>
</html>
#top {
position: relative;
background-color: #036fab;
color: white;
padding: 5px;
margin: 0px 0px 10px 0px;
}
#bottom {
position: relative;
background-color: #c2dfef;
padding: 5px;
margin: 10px 0px 0px 0px;
}
#left {
float: left;
background-color: #ece3a5;
padding: 5px;
width: 150px;
border-bottom-width: 5px;
}
#right {
float: right;
background-color: #ece3a5;
padding: 5px;
width: 150px;
}
.center_content {
position: relative;
background-color: #dddddd;
padding: 5px;
float: left;
position:relative;
}
.left_content {
background-color: #dddddd;
padding: 5px;
margin-left: 170px;
float: right;
position: relative;
float: left;
left: 5px;
}
.right_content {
background-color: #dddddd;
padding: 5px;
margin: 0px 170px 0px 170px;
}
#top a:link, #top a:visited {
color: white;
font-weight : bold;
text-decoration: none;
}
#top a:link:hover, #top a:visited:hover {
color: black;
font-weight : bold;
text-decoration : underline;
}
#content{
}
#testID{
background-color: #111111;
float: right;
padding: 10em 10em 10em 10em;
}
<link href="resources/css/default.css" rel="stylesheet" type="text/css" />
<link href="#{facesContext.externalContext.requestContextPath}/resources/css/default.css" rel="stylesheet" type="text/css" />