试图从React Material Ui覆盖AppBar的css，

grow和menuButton样式直接来自Material Ui的AppBar代码，但我正在尝试将标题样式实现到AppBar中，但没有成功，我已经阅读了文档，但对我来说不是很清楚

    const useStyles = makeStyles((theme: Theme) =>
  createStyles({
    header: {
      borderTop: '10px',
      borderTopColor: '#367BB5'
    },
    grow: {
      flexGrow: 1
    },
    menuButton: {
      marginRight: theme.spacing(2),
    }
);

编辑：

文档中说，

样式表名称：MuiAppBar

，但每当我将标题更改为该名称时，它不会更改任何内容

export default Header;

---

这样做可以更改背景颜色，但其他属性不起作用。不知道为什么

遵循此页面很重要：

---

您需要使用

ThemeProvider

来定制样式

我明白了。放松点，我们是来帮忙的。我在您的代码中没有看到该提供程序。让我们试着做一些事情，把我们放在相同的背景下。这正是我们在页面上的示例。你要做的是覆盖全局变量，而你却忽略了这个概念。没问题。例如，您希望更改背景。使用覆盖键：

overrides:{MuiAppBar:{colorPrimary:{backgroundColor:yellow.A700}}}，

检查代码沙盒，如果这是您的回答，请检查代码沙盒。别忘了投票。我们正在帮助获得积分<代码>覆盖：{MuiAppBar:{colorPrimary:{backgroundColor:yellow.A700}，根：{border:0，borderTop:10，borderTopColor:orange[500]，borderTopStyle:“solid”}}，我只是想在标记为答案之前看看它是否有效！的确如此，非常感谢！你会如何像AppBar的内部一样进行目标定位？在AppBar的内部？我看的不多，但我认为你可以在他们的页面上浏览示例。但是您可以通过以下方式更改标题：

News

    const useStyles = makeStyles((theme: Theme) =>
  createStyles({
    header: {
      borderTop: '10px',
      borderTopColor: '#367BB5'
    },
    grow: {
      flexGrow: 1
    },
    menuButton: {
      marginRight: theme.spacing(2),
    }
);

export default Header;

    const useStyles = makeStyles({
      root: {
        position: 'static', // doesnt work
        borderTop: '100px', // doesnt work
        borderTopColor: '#367BB5', // doesnt work
        backgroundColor: '#fafafa',
      },
    })

      <AppBar position="static" classes={{ root: classes.root }}>