Css 自定义.ui状态活动-selectManyButton的样式

我想向primefaces 5.1中的selectManyButton添加自定义样式。我要更改的样式绑定到.ui状态活动类。当我更改这个类时，我得到selectManyButton的自定义样式，但是引用这个样式类的所有其他元素也都更改了。如何使某个元素更改为定义的样式

<p:selectManyButton  value="#{projektCriteriaBean.selectedOptions}" >
        <f:selectItems value="#{projektCriteriaBean.yearSelection}"  />
        <p:ajax listener="#{projektCriteriaBean.changeDate}"  update=":form:startDate,:form:endDate" />
    </p:selectManyButton>

---

您需要为按钮指定一个

id

或

styleClass

<h:form id="my_form">
    <p:selectManyButton id="my_unique_selector" styleClass="generic-selector"
            value="#{projektCriteriaBean.selectedOptions}">
        <!--  ... -->
    </p:selectManyButton>
</h:form>

或按id：

#my_form\:my_unique_selector .ui-state-active {
    background-color: red;
}

---

冒号是JSF命名容器的默认分隔符char。它需要用反斜杠转义，因为

：

在CSS中有特殊的含义。更多信息。

太好了，很有效！非常感谢您快速、准确的回答。我不能节省周日晚上的时间。

#my_form\:my_unique_selector .ui-state-active {
    background-color: red;
}