PrimeNG

Question

我使用的是 4.0.1 版

p-growl 消息有黄色背景颜色和黑色字体颜色，即使 严重性 消息设置为错误。

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

我尝试在 .ui-growl-message 和 [= 上设置我的风格22=].ui-growl-container 但是没有任何反应，例如：

我的-component.component.css

.ui-growl-message {
    color: red;
}

Answer 1

您可能必须在选择器之前添加以下内容之一：

/deep/

>>>

在选择器之前。如果您使用的是 CLI，则使用 /deep/，否则。使用另一个。

/deep/ .ui-growl-message {
    color: red;
}

更新：

改用::ng-deep。

Answer 2

就目前的 primeNG 样式而言，您必须实际应用根 styles.css 中的样式，以使用 styleClass 属性覆盖特定 Prime 组件的样式。

例如：

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

在styles.css中：

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

}

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

不鼓励使用 /deep/、>>> 或 ::ng-deep::。

PrimeNG - 如何改变 p-growl 风格