PrimeFaces面板風格內容CSS

我tyring到風格UI面板的內容都沒有成功，這裏是我申請PrimeFaces面板風格內容CSS

.loginPanel.ui-panel-content { 
     border: 0; 
     background: red; 
     padding: 0.5em 1em;

也嘗試過CSS：

.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>

個

任何想法如何設置

更新：這裏是源

<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>

來源

2012-08-28 Astronaut

請在此處粘貼您的xhtml文件源，而不是從瀏覽器中呈現的html。因爲你指定了'background：red; '你的面板是紅色的！你想要給你的面板什麼樣的風格。 – Heidarzadeh

問題是我無法從類中訪問容器，因爲我無法在其中放入一個ID。我迄今爲止已經放棄了這個想法。 – Astronaut

你能否在這裏複製你的xhtml代碼。當然是 – Heidarzadeh

-2

如果你不希望它的子元素在您的表單元素使用此屬性JSF要前置形式ID：

<h:form prependId='false'>

然後你就可以通過自己的ID訪問的元素。

來源

2012-08-30 02:19:14 Heidarzadeh

好吧，試試看。但問題是，面板生成一個容器div和3行div的4個div：一個標題，一個內容和一個頁腳，我沒有特別的權限訪問這些div，但生病嘗試使用它。 – Astronaut

我放棄了面板的想法，並使用div，我可以自由格式化，因爲我希望...仍然有很多東西從這些面部組件丟失，使佈局和定位就像使用DIV一樣簡單， SPAN和CSS ......仍然有很多表的使用，只是爲了讓事情成爲陣容。

來源

2012-09-12 10:18:12 Astronaut

PrimeFaces面板風格內容CSS

回答

相關問題