Question

我在项目中使用Material-UI，我试图覆盖textTransform:"uppercase"的默认主题样式，而是将其替换为textTransform:"capitalize"。

咨询custom styling上的文档告诉我，我应该使用内联样式或自定义类。

添加className="capitalize"（在类中具有text-transform属性）或添加style={{textTransform: "capitalize"}}会产生相同的结果。父div传递CSS属性，但最终被子span覆盖。

这是intended behavior，还是我做错了什么？

Answer 1

您可以使用自定义主题覆盖textTransform：

const App = () => {
    const customTheme = { button: { textTransform: 'capitalize' } };

  return (
    <MuiThemeProvider muiTheme={getMuiTheme(customTheme) }>
      <Example />
    </MuiThemeProvider>
  )
};

工作jsFiddle：https://jsfiddle.net/88uq8751/7/

Answer 2

请在您的问题中提供更多信息。但是，我认为这不是预期的行为。我猜，检查你的其他道具，也许与那些道具风格道具的效果越来越重要。

如果不是原因，请检查GitHub上的material-ui repo代码库。根据我使用material-ui的经验，通过浏览代码库而不使用他们的doc解决了许多问题。希望信息有所帮助。

无法覆盖Material-UI主题样式

2 个答案: