Добавить изображение или значок в заголовок вкладки Primefaces

Question

я пытаюсь использовать изображение / значок в заголовке вкладки вместо текстового заголовка (или, возможно, использую оба из них), я тестировал, используя titleStyleClass, устанавливающий фон изображения, но не работает

моя вкладка простых лиц:

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

Мой стиль CSS

 .tCliente 

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

Спасибо за вашу помощь: D

Answer 1

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

Надеюсь, это поможет.

Answer 2

Вы должны поставить:

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

, но после этого у меня возникает проблема: изображение повторяется в заголовке.Я пытался решить, добавив background-repeat:no-repeat;, но это то же самое ... кто-то может помочь?

Answer 3

попробуйте добавить display:inline-block;

Answer 4

попробуйте так

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