Question

例如，如果我动态地需要将MUI主题应用于我的非MUI组件，例如<h1>。如果我希望<h1>标签始终是相同的颜色（从主题颜色开始）并且始终使用相同的边距，那么我该如何在主题中全局定义它，而不仅仅是按组件生成它。 <h1>只是一个例子，但我的关注范围延伸到我可能在我的应用中使用的任何第三方组件。

Answer 1

假设您有一个 ParentComponent 并且您希望将样式应用于其子组件：

const useStyles = makeStyles({
  '@global': {
    '.children-css-selector': {
      height: 100,
      width: 100,
      backgroundColor: 'blue'
    }
  }
});

export default function ParentComponent() {
  useStyles();

  return (
       your code....
  )
}

如何使用MUI主题为非MUI组件设置样式？

1 个答案: