覆盖子组件的 CSS

Override CSS of child component

<div class="app-component">
   <child class="test">{{name}}</child>
</div>

和我的 CSS 子样式 class

.{
   text-align:center;
}

我确实在父组件中重写了,即在应用程序组件中作为

:host /deep/ .test{
       text-align:right;
        color: red;
     }

所以在这段代码中只有 "color:red" 工作正常,但是我想覆盖的 "text-align:right" 不工作

感谢任何帮助 我想覆盖预定义 Css 的值并添加一些 css 也...添加 CSS 有效但修改 CSS 值无效

:host /deep/ .test{
       text-align:right !important; 
        color: red;
     }

对我有用..

还有其他解决方案吗?