PrimeFaces面板样式内容CSS
我是轮胎样式的ui面板内容没有成功,这里是我申请的CSSPrimeFaces面板样式内容CSS,css,jsf,primefaces,Css,Jsf,Primefaces,我是轮胎样式的ui面板内容没有成功,这里是我申请的CSS .loginPanel.ui-panel-content { border: 0; background: red; padding: 0.5em 1em; 还尝试: .loginPanel.ui-panel, .loginPanel.ui-panel-content { border: 0; background: red; padding: 0.5em 1em;
.loginPanel.ui-panel-content {
border: 0;
background: red;
padding: 0.5em 1em;
还尝试:
.loginPanel.ui-panel, .loginPanel.ui-panel-content {
border: 0;
background: red;
padding: 0.5em 1em;
但这会使整个面板变红
以下是我试图针对的输出HTML:
<div id="j_idt9:loginPanel" class="ui-panel ui-widget ui-widget-content ui-corner-all loginPanel">
<div id="j_idt9:loginPanel_header" class="ui-panel-titlebar ui-widget-header ui-helper-clearfix ui-corner-all">
<span class="ui-panel-title">Login</span>
</div>
<div id="j_idt9:loginPanel_content" class="ui-panel-content ui-widget-content">
<table id="j_idt9:loginPanelGrid" class="ui-panelgrid ui-widget loginPanelGrid" role="grid">
<tbody>
<tr class="ui-widget-content" role="row">
<td role="gridcell">Username</td>
<td role="gridcell">
<input id="j_idt9:username" name="j_idt9:username" type="text" class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all" role="textbox" aria-disabled="false" aria-readonly="false" aria-multiline="false">
</td>
</tr>
<tr class="ui-widget-content" role="row">
<td role="gridcell">Password</td>
<td role="gridcell">
<input id="j_idt9:password" name="j_idt9:password" type="password" class="ui-inputfield ui-password ui-widget ui-state-default ui-corner-all" role="textbox" aria-disabled="false" aria-readonly="false" aria-multiline="false">
</td>
</tr>
<tr class="ui-widget-content" role="row">
<td role="gridcell">
<button id="j_idt9:j_idt14" name="j_idt9:j_idt14" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" onclick="statusDialog.show();PrimeFaces.ab({source:'j_idt9:j_idt14',update:'j_idt9:growlID',oncomplete:function(xhr,status,args){statusDialog.hide();}});return false;" type="submit" role="button" aria-disabled="false">
<span class="ui-button-text">Submeter</span>
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div id="j_idt9:loginPanel_footer" class="ui-panel-footer ui-widget-content">V.1.0</div>
</div>
登录
用户名
密码
子计
V.1.0
你知道怎么设置吗
更新:这里是来源
<div class="loginFromContainer">
<h:form>
<p:growl id="growlID">
</p:growl>
<p:panel id="loginPanel" styleClass="loginPanel" header="Login SRB Armazem" footer="V.1.0">
<p:panelGrid id="loginPanelGrid" columns="1" styleClass="loginPanelGrid">
<h:outputText value="Username" />
<p:inputText id="username" value="#{loginController.userName}" />
<h:outputText value="Password" />
<p:password id="password" value="#{loginController.passWord}" />
<p:commandButton value="Submeter" update="growlID" onclick="statusDialog.show()" oncomplete="statusDialog.hide()" actionListener="#{loginController.verifyLogin(event)}" action="#{loginController.decideRedireccionar()}" />
</p:panelGrid>
</p:panel>
</h:form>
如果您不希望jsf将表单id前置到其子元素,请在表单元素中使用此属性:
然后您可以通过元素的ID访问元素。我放弃了面板的想法,使用div,我可以按照自己的意愿自由设置格式。。。这些面组件仍然缺少很多东西,使得布局和定位像使用div、span和CSS一样简单。。。仍然大量使用表格,只是为了使内容排列整齐。请将xhtml文件源粘贴到此处,而不是从浏览器中呈现的html。因为你已经指定了背景:红色代码>你的面板是红色的!你到底想给你的面板什么样的风格。问题是我不能从类中访问容器,因为我不能在其中放置ID。到目前为止,我已经放弃了这个想法。你能把你的xhtml代码复制到这里吗。用源代码更新,任何想法都会很棒!好的,我试试看。但问题是面板生成了4个div,一个容器div和3个行div:一个页眉、一个内容和一个页脚,我没有访问这些div的权限,但我会尝试使用它们。