2012-01-23 32 views
13

即時通訊嘗試使用選項卡標題上的圖像/圖標而不是文本標題(或可能使用它們兩個),我正在測試使用titleStyleClass設置圖像背景但不起作用添加圖像或圖標到primefaces選項卡標題

我primefaces標籤:

<p:tab titleStyleClass="tCliente" title="Vehiculo"> 

我的CSS樣式

.tCliente 

{  
    background-image: url(../images/logo_tropidatos.gif); 
} 

感謝您的幫助:d

回答

37

在PrimeFaces 3.0和較新的,你可以添加一個面覆蓋在標籤標題:

<p:tabView> 
    <p:tab> 
     <!-- overrides title on tab--> 
     <f:facet name="title"> 
       <h:outputText value="tab title"/> 
       <p:graphicImage value="/resources/images/icon.png"/> 
      </f:facet> 

     <h:panelGrid> 
      <!-- tab content --> 
     </h:panelGrid> 
    </p:tab>  
</p:tabView> 

希望它能幫助。

+0

不適合我。我的xmlns是xmlns:p =「http://primefaces.org/ui」。我錯過了什麼? – Eddy

1

嘗試添加display:inline-block;

2

你應該把:

background-image: url("../images/logo_tropidatos.gif") !important;

但之後,我有一個問題:圖像重複到頁眉。 我試圖解決加入background-repeat:no-repeat;但是是一樣的...有人可以幫忙嗎?

1

嘗試這種方式

background-image: url("../images/logo_tropidatos.gif") !important; 
background-repeat:no-repeat !important; 
+0

這不是一個解決方案 –