Question

我有一个带有css文件的JSF页面可以正常工作，但是，当我添加表单标签时，css不适用于jsf。有人能帮帮我吗？

<f:view contentType="text/html">
    <h:head>
        <h:outputStylesheet library="css" name="LoginCss.css" />
    </h:head>

    <h:body>
         <h:form id="loginForm"> 
              <p:outputLabel id="usernameLabel" value="User name: " />
              <p:inputText id="usernameInput" value=""/> <br/> <br/>

              <p:outputLabel id="passwordLabel" value="Password: " />
              <p:inputText id="passwordInput" value=""/> <br/> <br/>
         </h:form>
    </h:body>

</f:view>

Answer 1

仅详细说明BalusC的评论：在您添加表单后，JSF会将表单的id添加到其子代的id中，因此第一个inputText现在将具有{{ 1}}（正如您在＆＃34; show source＆＃34;或浏览器中的类似内容中所见）。

由于这打破了样式，我希望您目前使用id进行样式设置。更好的做法是使用id="loginForm:usernameInput"属性。您也可能希望将inputText绑定到styleClass属性中的bean属性。进一步的建议是使用value和p:panelGrid作为密码：

p:password

和

.usernameInput {
    ...
}
.passwordInput {
    ...
}

如何在jsf中正确使用css？

1 个答案: