PrimeNG - 如何改变p-growl风格

Question

我正在使用版本4.0.1

即使严重性，

p-growl 消息也具有黄色背景颜色和黑色字体颜色消息设置为 错误 。

如何更改此组件的样式？该文档似乎不是最新的。 https://www.primefaces.org/primeng/#/growl

我尝试在 .ui-growl-message 和 .ui-growl-container 但没有任何反应，例如：

MY-component.component.css

double

Answer 1

您必须在选择器之前添加以下其中一项：

/deep/

>>>

选择器前的

。如果您正在使用CLI，请使用/deep/，否则请使用/deep/ .ui-growl-message { color: red; } 。使用另一个。

::ng-deep

<强>更新

改为使用any()。

Answer 2

截至PrimeNG样式的那一刻，您必须实际应用根styles.css中的样式，以使用styleClass属性覆盖特定Prime组件的样式。

例如：

<p-growl [value]="registerMessages" styleClass="registerGrowl"></p-growl>

style.css中的

：

.registerGrowl.ui-growl {
position: relative;
width: 100%;
top: 0;
right: 0;

}

在浏览器的开发工具中检查您的元素，找出正确的CSS元素。

使用/ deep /，＆gt;＆gt;＆gt;或者:: ng-deep ::不鼓励。