如何覆蓋號碼：selectOneRadio默認圖標

我有以下p:selectOneRadio：如何覆蓋號碼：selectOneRadio默認圖標

<p:outputPanel id="customPanel"> 

     <p:selectOneRadio id="customRadio" value="#{dyna.selecetedlist}" layout="grid" columns="1"> 
      <c:forEach var="list" items="#{dyna.userlist}" varStatus="loop"> 
        <f:selectItem itemEscaped="true" itemLabel="#{list.id.tbCode}" itemValue="#{list.id.tbCode}" /> 
      </c:forEach> 
      <p:ajax update=":form1:tabexam,:form1:msg,:form1:colser" listener="#{dyna.updatecolumns}"/> 
      </p:selectOneRadio> 

    </p:outputPanel>

能產生這樣的：

enter image description here

我要的是重寫默認圖標和p:selectOneRadio佈局。並使其象下面這樣：

enter image description here

來源

2014-02-10 Jalal Sordo

只差一分''

在HTML中已被棄用，不應再使用。 http://stackoverflow.com/questions/1798817/why-is-the-center-tag-deprecated-in-html –

要自定義圖標，頁面上覆蓋.ui-radiobutton-icon（存在包括妥善包裝css文件的清潔劑的選擇）：

<style type="text/css"> 
    .ui-radiobutton-icon{ 
     background: url(imgs/icon.png) no-repeat; !important; 
    } 
</style>

編輯：重寫

.ui-state-hover類重寫默認的懸停樣式組件
.ui-state-active clasas覆蓋默認選擇的樣式組件

注意覆蓋兩個類上面列出將影響頁面上所有組件。重寫時務必使用自定義命名空間。舉個例子

.my-custom-ns .ui-state-hover{ 
    //css 
    }

，然後在組件定義：

<p:selectOneRadio id="customRadio" value="#{dyna.selecetedlist}" styleClass="my-custom-ns" layout="grid" columns="1"> 
     <c:forEach var="list" items="#{dyna.userlist}" varStatus="loop"> 
       <f:selectItem itemEscaped="true" itemLabel="#{list.id.tbCode}" itemValue="#{list.id.tbCode}" /> 
     </c:forEach> 
     <p:ajax update=":form1:tabexam,:form1:msg,:form1:colser" listener="#{dyna.updatecolumns}"/> 
     </p:selectOneRadio>

來源

2014-02-11 22:47:30 kolossus

如何選擇和懸停？ –

@Papa_Jay - 查看編輯 – kolossus

如何覆蓋號碼：selectOneRadio默認圖標

回答

相關問題