作者:携手相约幸福 | 来源:互联网 | 2023-02-09 17:58
我想知道如何完成以下工作。我使用蚂蚁设计框架,我用CSS模块捆绑在一起反应项目。
我所希望做的是选择基于使用CSS-模块产生一个父类的div这就是一些蚂蚁类。
目前,我有这个心不是哪个正确的:
.container
flex-grow: 1 !important
.container
\:global &.ant-layout-sider-collapsed
.anticon
font-size: 16px
margin-left: 8px
.nav-text
display: none
.ant-menu-submenu-vertical > .ant-menu-submenu-title:after
display: none
这将产生以下:
.Navigation__container___1S9AX {
flex-grow: 1 !important; }
.container.ant-layout-sider-collapsed .anticon {
font-size: 16px;
margin-left: 8px; }
.container.ant-layout-sider-collapsed .nav-text {
display: none; }
.container.ant-layout-sider-collapsed .ant-menu-submenu-vertical > .ant-menu-submenu-title:after {
display: none;
我想要得到的是:
.Navigation__container___1S9AX {
flex-grow: 1 !important; }
.Navigation__container___1S9AX.ant-layout-sider-collapsed .anticon {
font-size: 16px;
margin-left: 8px; }
.Navigation__container___1S9AX.ant-layout-sider-collapsed .nav-text {
display: none; }
.Navigation__container___1S9AX.ant-layout-sider-collapsed .ant-menu-submenu-vertical > .ant-menu-submenu-title:after {
display: none;
感谢帮助,我尝试在Google搜索中搜索有关如何在CSS模块中工作的更多信息,但找不到太多信息。
1> Adam Wolski..:
以下是正确的语法:
.container {
&:global(.ant-layout-sider-collapsed) {
:global(.anticon) {
//anticon css
}
}
}