PrimeFaces如何改变咆哮的关闭图标颜色

时间:2016-07-26 16:49:12

标签: css jsf primefaces

我在PrimeFaces上工作,我正在尝试编辑组件的css属性。在咆哮的时候,我试图改变关闭图标的颜色,但我不能。我尝试了很多很多但仍然无法弄清楚。

enter image description here

你可以在右上角看到它的背景颜色为黄色,我设置它但我不能改变图标颜色。它总是那么蓝。这是关于咆哮的代码;

.ui-growl{
    position:fixed;
    top:20%;
    left:38%;
    width: 23%;
}

.ui-growl .ui-state-highlight{
    background: #d2524f;
    border: #d2524f;

}

.ui-growl-message{      
    float: left;
    font-size: 15px;
    margin: 2% 0 0 22%;
}

.ui-growl .ui-growl-icon-close{
    background-color:yellow;
}

1 个答案:

答案 0 :(得分:5)

通过以下CSS选择器使用 background-image 属性绘制结束图标:

.ui-state-highlight .ui-icon {
  background-image: url("/showcase/javax.faces.resource/images/ui-icons_ffffff_256x240.png.xhtml?ln=primefaces-omega");
}

更改颜色属性无效。要更改图标颜色,您必须修改图像网址。这个answer给出了一些关于该主题的提示。

使用PrimeFaces ShowCase进行测试。