jquery - 使用不同颜色的选项卡创建一个 primefaces 手风琴

Question

如何将手风琴的标签设置为具有各种颜色？现在我的 CSS 文件中有：

.ui-accordion .ui-accordion-header a {
    color: rgb(250,250,250);
    background: blue;
}

编辑：我更正了我的帖子，因为我忘了说我使用 Primefaces 我的 xhtml 文件具有以下内容：

<p:accordionPanel multiple="true" >
  <p:tab title="Blue Tab">
    <h:panelGrid columns="1" cellpadding="10">
      <h:outputText
        value="This tab must be blue" />
    </h:panelGrid>
  </p:tab>
  <p:tab title="Red Tab">
    <h:panelGrid columns="1" cellpadding="10">
      <h:outputText
        value="This tab must be red" />
    </h:panelGrid>
  </p:tab>
</p:accordionPanel>

此时我的两个标签都是蓝色的。我怎样才能使第二个变红？

Answer 1

I found a solution. I added a titleStyleClass for each different colored tab:

<p:accordionPanel multiple="true">
  <p:tab title="Blue Tab" titleStyleClass="blueTab">
    <h:panelGrid columns="1" cellpadding="10">
      <h:outputText
        value="This tab must be blue" />
    </h:panelGrid>
  </p:tab>
  <p:tab title="Red Tab" titleStyleClass="redTab">
    <h:panelGrid columns="1" cellpadding="10">
      <h:outputText
        value="This tab must be red" />
    </h:panelGrid>
  </p:tab>
</p:accordionPanel>

and in my CSS file I set the background color for each titleStyleClass:

.blueTab {
  background: blue;
}

.redTab {
  background: red;
}

It works fine. I hope this helps someone!!