Question

假设我有一个面板网格，并希望每个标签都有单独的颜色。我该怎么做？

.cols {
    vertical-align: top;
}
</h:outputStylesheet>
    <h:form id="form">
        <h:panelGrid columns="2" columnClasses="cols,cols" width="400">
            <rich:panelMenu style="width:200px" itemMode="ajax" groupMode="ajax"
                groupExpandedLeftIcon="triangleUp"
                groupCollapsedLeftIcon="triangleDown"
                topGroupExpandedRightIcon="chevronUp"
                topGroupCollapsedRightIcon="chevronDown" itemLeftIcon="disc"
                itemChangeListener="#{panelMenuBean.updateCurrent}">
                <rich:panelMenuGroup label="Group 1">
                    <rich:panelMenuItem label="Item 1.1" name="Item_1_1" />
                    <rich:panelMenuItem label="Item 1.2" name="Item_1_2" />
                    <rich:panelMenuItem label="Item 1.3" name="Item_1_3" />
                </rich:panelMenuGroup>
                <rich:panelMenuGroup label="Group 2">
                    <rich:panelMenuItem label="Item 2.1" name="Item_2_1" />
                    <rich:panelMenuItem label="Item 2.2" name="Item_2_2" />
                    <rich:panelMenuItem label="Item 2.3" name="Item_2_3" />
                    <rich:panelMenuGroup label="Group 2.4">
                        <rich:panelMenuItem label="Item 2.4.1" name="Item_2_4_1" />
                        <rich:panelMenuItem label="Item 2.4.2" name="Item_2_4_2" />
                        <rich:panelMenuItem label="Item 2.4.3" name="Item_2_4_3" />
                    </rich:panelMenuGroup>
                    <rich:panelMenuItem label="Item 2.5" name="Item_2_5" />
                </rich:panelMenuGroup>
                <rich:panelMenuGroup label="Group 3">
                    <rich:panelMenuItem label="Item 3.1" name="Item_3_1" />
                    <rich:panelMenuItem label="Item 3.2" name="Item_3_2" />
                    <rich:panelMenuItem label="Item 3.3" name="Item_3_3" />
                </rich:panelMenuGroup>
            </rich:panelMenu>
            <a4j:outputPanel ajaxRendered="true">
                <rich:panel rendered="#{not empty panelMenuBean.current}">
                    <h:outputText value="#{panelMenuBean.current} selected"
                        id="current" />
                </rich:panel>
            </a4j:outputPanel>
        </h:panelGrid>
    </h:form>
</ui:composition>

在这种情况下，如果我想修改单个panelMenuGroup的颜色。那怎么做？请解释尝试搜索这么多网站，但没有扩展。

Answer 1

尝试使用style标记的styleClass和rich:panelMenuGroup属性（有关完整的属性列表，请参阅here）。这样，您应该能够为每个panelMenuGroup提供直接样式或CSS类。

示例：

    <rich:panelMenuGroup label="Red Group 2" style="color:red;">
        <rich:panelMenuItem label="Item 2.1" name="Item_2_1" />
        <rich:panelMenuItem label="Item 2.2" name="Item_2_2" />
        <rich:panelMenuItem label="Item 2.3" name="Item_2_3" />
        <rich:panelMenuGroup label="Group 2.4">
            <rich:panelMenuItem label="Item 2.4.1" name="Item_2_4_1" />
            <rich:panelMenuItem label="Item 2.4.2" name="Item_2_4_2" />
            <rich:panelMenuItem label="Item 2.4.3" name="Item_2_4_3" />
        </rich:panelMenuGroup>
        <rich:panelMenuItem label="Item 2.5" name="Item_2_5" />
    </rich:panelMenuGroup>

如何更改rich的背景颜色：panelMenu Group in richfaces？

1 个答案: