将图像或图标添加到 primefaces 选项卡标题 [英] Add an image or icon to primefaces tab header

问题描述

我试图在选项卡标题上使用图像/图标而不是文本标题(或可能同时使用它们)，我正在测试使用 titleStyleClass 设置图像背景但不起作用

im trying to use an image /icon on a tab header instead of text title(or may using both of them), i was testing using titleStyleClass seting an image background but doesnt work

我的素面标签:

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

我的css样式

 .tCliente 

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

感谢您的帮助:D

推荐答案

在 PrimeFaces 3.0 和更新版本上，您可以添加一个方面来覆盖选项卡上的标题:

On PrimeFaces 3.0 and newer you can add a facet to override title on tabs:

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

希望有帮助.

这篇关于将图像或图标添加到 primefaces 选项卡标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！