css - 更改 f :facet name ="header" in primefaces 的颜色

Question

有什么方法可以用来更改数据表 (primefaces) 中 facet 标题的颜色(通常是 css 样式)。

            <p:dataTable id="iddata" var="test" value="#{test.getDataValue()}"
            styleClass="borderless">
            <f:facet name="header">
                <h:graphicImage value="../../theme/images/ffolder.png" />
                <h:outputText value="Your data" styleClass="outputTextStyle"></h:outputText>

                    <p:commandButton id="dynaButton2" value="add data" ajax="true"
                    action="#{lpcRecordAddition.formSubmit}"/> 

            </f:facet>

            <p:column>
                <p:panelGrid>

                    ... some code ...
                </p:panelGrid>

                <f:facet name="header">
                    <div style="float: left;">
                        <p:selectOneMenu value="" style="width:160px">
                            <f:selectItem itemValue="tezst1" itemLabel="action" />
                            <f:selectItem itemValue="tezst2" itemLabel="test1" />
                            <f:selectItem itemValue="tezst3" itemLabel="test2" />
                        </p:selectOneMenu>
                    </div>
                </f:facet>

                <f:facet name="header">
                    <div style="float: left;" >
                        <p:selectOneMenu value="" style="width:160px">
                            <f:selectItem itemValue="tezst1" itemLabel="sir" />
                            <f:selectItem itemValue="tezst2" itemLabel="test1" />
                            <f:selectItem itemValue="tezst3" itemLabel="test2" />
                        </p:selectOneMenu>
                    </div>
                </f:facet>
            </p:column>
        </p:dataTable>

我想更改包含最后 2 个组合框的 2 个方面标题的颜色。

Answer 1

Datatable 将呈现为 HTML 表格。所以列标题将是 th

你可以从下面的 CSS 实现这个

.customHeader th{
    background-color: black;
}

为所需的p:column 指定styleClass

<p:column styleClass = "customHeader ">
...
</p:column>