所以我正在构建一个 React 应用程序并有一个快速的问题。如果我有两个独立的组件: 和 分别使用 CSS 类 navigation.css 和 navigationLogo.css。在 navigation.css 中，我有一个名为 .main 的类，在 navigationLogo.css 中，我想要一个这样的类:
.main .main_in_logo {
color: red;
}
但是使用 CSS 模块我无法做到这一点，有什么解决方法吗？
最佳答案
我只是觉得这里的解释不够完整。在 css 中，您执行 .parentSelector .childSelector 以选择 child 。同样的规则适用于 css 模块，但在您的 html/jsx 中，您应该向父级和子级添加相关的 className -> styles.parentSelector 、styles.childSelector。
<div className={styles.container}>text</div>
这样你就可以在你的 css 中有这样的东西:
.banner .container{
background-color:reb;
}
.banner .container{
background-color:blue;
}
有时您使用库，并且想要更改库中 DOM 中某处的某些内容，但您无法更改其源代码。在这种情况下，您可以像这样使用 :global:
.parentElement :global(div)
.parentElement :global(#some-lib-element-selector)
关于CSS 模块和 ReactJS : Parent and child CSS classes in different components，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42191671/