材质UI，目标按钮变量css选择器

我创建了3个类，为每种类型的材质UI按钮变量应用渐变。这些类是：

gradient

，

outlinedGradient

，和

containedGradient

但是我只想创建一个类

gradient

，然后为按钮是材质UI的默认按钮、轮廓按钮或包含按钮创建更具体的选择器，这样在更改按钮样式时就不必手动更改渐变类

我尝试使用选择器

“&.MuiButton contained:”

和

&.MuiButton概述了

，但没有应用这些样式

不工作：

const styles=（主题）=>({
根目录：{
填充：theme.space.unit
},
按钮：{margin:theme.spating.unit}，
坡度：{
背景：theme.palette.primary.mainGradient，
“-webkitBackgroundClip”：“文本”，
“-webkitTextFillColor”：“透明”，
“&.包含的MuiButton”：{
“-webkitBackgroundClip”：“未设置”，
-webkitTextFillColor:“黑色”
},
“&.穆伊布顿概述”：{
…更多款式
}
}
});

代码沙盒：

• 工作
• 不起作用

有可能这样做吗？要在css in material UI中针对这些按钮变体？

我找到了答案

您正在使用子代选择器引用CSS类，但MuiButtonBase root位于根元素上（即，样式化组件类名将应用于的同一元素），因此适当的语法为&.MuiButtonBase root（不带符号和后的空格）

我只需要在选择器

“&.MuiButton contained”

中省略空格，而不是

“&.MuiButton contained”