css - Primefaces 删除指定的 ui-icon

Question

在我的 Primefaces 中，我使用的是菜单栏。在菜单右侧的三 Angular 形图标是不必要的，所以我想删除它。我在 CSS 上试了一下

   .submenu .ui-icon-triangle-1-s{
        display: none;
    }

但它会影响整个页面的其他组件(即 selectOneMenu)，但我需要删除子菜单中的三 Angular 形图标。我尝试以下代码:

 <h:form>
    ...
    <p:menubar>
       <p:submenu label="File">
          <p:menuitem value="Open"/>
          ...
       </p:submenu>
    </p:menbar>
    .....
    <p:selectOneMenu id="User">
       .....
    </p:selectOneMenu>
 </h:form>

Answer 1

您的方法似乎是正确的。使用以下形式的 css 后代选择器:

.calss1 .class2 {
    /* style */
}

使样式应用于所有具有 css class2 且父组件也具有 css class1 的组件。在您的示例中，将子菜单的 styleClass 设置为“submenu”会隐藏该子菜单的三 Angular 形图标。

<p:submenu label="File" icon="ui-icon-document">
    <p:submenu label="New" icon="ui-icon-contact" styleClass="submenu">
        <p:menuitem value="Project" url="#" />
        <p:menuitem value="Other" url="#" />
    </p:submenu>
</p:submenu>