将 css 样式应用于我的 angular 应用中的所有 primeng 对话框
Apply css style to all primeng dialogs in my angular app
我在我的 angular 应用程序中使用 prime ng 对话框。我可以使用 ng-deep 更改每个特定的对话框样式。例如，我有联系我们页面，我有这些文件：
contact.html
contact.component.ts
contact.css
所以我将下面的 css 放在 contact.css 中，它改变了联系我们对话框标题栏的颜色。
:host ::ng-deep .ui-dialog .ui-dialog-titlebar{
background-color: red
}
我想为我的应用程序中的所有对话框执行此操作，我该怎么做？我在 src 文件夹的 style.css 文件中放置了相同的 css，但它没有用。
因此 angular 组件默认采用非常方便的 Style Encapsulation 策略，这样样式就不会渗入其他组件并导致不必要的影响。
您可以使用 ng-deep，就像您必须允许其中定义的样式被指定的子组件继承一样。
然而，对于要全局继承的事物，您需要按照开始的顺序将它们定义在最上面，以便这些样式 级联 到下面的选择器。在不使用 SCSS 或其他预处理器的默认 angular 应用程序中，最简单的方法之一是将它们添加到第一个初始化的托管子组件的文件中，例如 index.html 或app.component 允许之后初始化的组件在渲染时继承它们。
希望这对您有所帮助，干杯！
我在我的 angular 应用程序中使用 prime ng 对话框。我可以使用 ng-deep 更改每个特定的对话框样式。例如，我有联系我们页面，我有这些文件：
contact.html
contact.component.ts
contact.css
所以我将下面的 css 放在 contact.css 中，它改变了联系我们对话框标题栏的颜色。
:host ::ng-deep .ui-dialog .ui-dialog-titlebar{
background-color: red
}
我想为我的应用程序中的所有对话框执行此操作，我该怎么做？我在 src 文件夹的 style.css 文件中放置了相同的 css，但它没有用。
因此 angular 组件默认采用非常方便的 Style Encapsulation 策略，这样样式就不会渗入其他组件并导致不必要的影响。
您可以使用 ng-deep，就像您必须允许其中定义的样式被指定的子组件继承一样。
然而，对于要全局继承的事物，您需要按照开始的顺序将它们定义在最上面，以便这些样式 级联 到下面的选择器。在不使用 SCSS 或其他预处理器的默认 angular 应用程序中，最简单的方法之一是将它们添加到第一个初始化的托管子组件的文件中，例如 index.html 或app.component 允许之后初始化的组件在渲染时继承它们。
希望这对您有所帮助，干杯！