`> *`选择器无法从父组件到子组件工作 [英] `>*` selector not working from parent to child component

问题描述

我有以下Angular组件

I have the following Angular component

<div id="content-div">
  <router-outlet></router-outlet>
</div>

我在上面的div中放置了不同的组件.我的要求是所有这些组件都应具有css规则height:100%.我没有复制此代码，而是尝试使用>* css，但这不起作用.

I place different components within the div above. My requirement is that all such components should have the css rule height:100%. Instead of duplicating this code, I tried to use >* css but that isn't working.

#content-div >* { 
  height:100%;
}

>*不能跨组件工作吗?我怎样才能使子组件从其父组件接受css规则?

Does >* doesn't work across components? How could I make a child component take css rule from its parent?

推荐答案

必须更改方法.代替使用>*，而使用css-grid.有效.

Had to change the approach. Instead of using >*, used css-grid. It worked.

#content-div{
  height:100%;
  display:flex;
  align-items: center;
  justify-content: center;
}

这篇关于`> *`选择器无法从父组件到子组件工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！