css - 覆盖 primefaces 的默认图标

Question

我是 primefaces 的新手，我想覆盖或更改 rowtoggler 的默认图标 ui-icon-circle-triangle-e 为 ui-icon-plus。请告诉我是否可行，如果可行，如何实现。

Answer 1

您可以在 web.xml 中使用以下代码删除所有 Primefaces 样式:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>none</param-value>
</context-param>

或者如果您喜欢整体样式，只需覆盖负责此特定图标的类，即 .ui-icon-circle-triangle-e

然后您可以将新的 css 选择器添加到 theme.css 之后或更具体的文件中。特异性是更好的方法。添加 styleClass="plus-table"在 <p:dataTable> 上和一个 css 选择器/样式，比如

.plus-table .ui-icon-circle-triangle-e {
    background-position: -16px -128px;
}

负号相同:

.plus-table .ui-icon-circle-triangle-s {
    background-position: -48px -128px;
}

应该可以。您可以随时添加 .plus-table到模板元素，所以它适用于任何地方，你不需要将它添加到每个组件

另见:

• > How do I override default PrimeFaces CSS with custom styles?