jquery - Primefaces + jQuery + 三角形图标(不显示)!

Question

我正在使用 primefaces 和 jQuery(我猜是因为我正在使用的模板中有这一行)

<h:outputScript library="primefaces" name="jquery/jquery.js" target="head"/>

所以假设当我使用这个时:(来自 here )

<p:accordionPanel multiple="true">
    <p:tab title="Godfather Part I">
        <h:panelGrid columns="2" cellpadding="10">
            <p:graphicImage name="demo/images/godfather/godfather1.jpg" />
            <h:outputText
                value="The story begins as Don Vito Corleone..." />
        </h:panelGrid>
    </p:tab>
    <p:tab title="Godfather Part II">
        <h:panelGrid columns="2" cellpadding="10">
            <p:graphicImage name="demo/images/godfather/godfather2.jpg" />
            <h:outputText value="Francis Ford Coppola's legendary..." />
        </h:panelGrid>
    </p:tab>
    <p:tab title="Godfather Part III">
        <h:panelGrid columns="2" cellpadding="10">
            <p:graphicImage name="demo/images/godfather/godfather3.jpg" />
            <h:outputText value="After a break of more than 15 years...." />
        </h:panelGrid>
    </p:tab>
</p:accordionPanel>

我应该看到一个完全可用的 Accordion 。嗯，我明白了，除了三角形图标之外的所有内容。

检查后，我发现每个选项卡中呈现的跨度如下:

<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all tab-in-accordion" role="tab" aria-expanded="false">
    <span class="ui-icon ui-icon-triangle-1-e"></span>
    Godfather Part I
</h3>

问题位于 <span class="ui-icon ui-icon-triangle-1-e"></span>但类(class)ui-icon-triangle-1-e在 chrome 检查器中不显示。我读过并且知道该类是提供背景和位置的类(使用 jquery 中的图标)。

如何解决这个问题并让三角形显示出来？

Answer 1

这是 bootstrap theme.css 的主题定义的问题。如果你检查过 CSS，你就会注意到它。将以下内容添加到主 css 文件中以使三角形图标可见。

.ui-accordion .ui-accordion-header .ui-icon { display: block; }