css - 更改 primefaces 手风琴图标

Question

有什么办法可以改变primefaces的手风琴面板中的图标吗？

我想将向右和向下箭头更改为 plus([+]) 和 minus([-]) 符号。

谁能解释一下怎么做？？

谢谢。

Answer 1

您可以添加一些自定义 CSS，将默认图标的背景位置更改为加号和减号：

.ui-accordion .ui-icon.ui-icon-triangle-1-e {
    background-position: -16px -128px;
}
.ui-accordion .ui-icon.ui-icon-triangle-1-s {
    background-position: -48px -128px;
}

在当前的 PrimeFaces 3.2 版本中，似乎没有更简洁的方法来显式指定组件上的.ui-icon-plusand 。您可能需要为此发布增强请求。.ui-icon-minus<p:accordionPanel>

Answer 2

you can using the JQuery:

$(document).ready(function() {
    $("#[accordion-id] h3 span.ui-icon").removeClass( "ui-icon-triangle-1-e" ).addClass( "ui-icon-plus" )
});

don't forget to replace the [accordion-id] with correct Accordion Id

Answer 3

您可以通过使用以下 CSS 代码来实现：

.ui-accordion .ui-accordion-header a .ui-accordion-toggle-icon::before { 
    content:'\e90d';
}