css - 来自父组件的CSS不适用于子组件Angular 9

Question

我有一个组件嵌套在带有一堆 HTML 的组件中。在父组件中，我试图将那里编写的 CSS 应用于嵌套组件。

例子：

/* this is within the parent css */
button{
    color: red;
}

但是在子组件中，组件的按钮不是红色的。

我正在像这样链接组件：

<!-- this is within the HTML of the parent -->
<div>
    <nested-component></nested-component>
</div>

标签： cssangularroutes

Answer 1

您可以预先:host ::ng-deep实现这一目标。

:host ::ng-deep button {
    color: red;
}