在MaterialCSS中使用createTheme定义自定义的H1、H2、H3样式的方法

在 Material-UI 中，你可以使用 createTheme 函数来定义自定义的主题，包括 H1、H2、H3 等标题的样式。以下是一个示例：

import { createTheme } from '@mui/material/styles';

const theme = createTheme({
  typography: {
    h1: {
      fontSize: '36px',
      fontWeight: 500,
      color: '#333',
    },
    h2: {
      fontSize: '24px',
      fontWeight: 500,
      color: '#333',
    },
    h3: {
      fontSize: '18px',
      fontWeight: 500,
      color: '#333',
    },
  },
});

在上述示例中，我们创建了一个名为 theme 的主题对象，并在其中定义了 typography 属性。在 typography 属性中，我们分别定义了 H1、H2、H3 标题的样式，包括字体大小、字重和颜色等。

你可以根据自己的需求修改这些样式属性，以满足你的设计要求。然后，你可以将这个主题对象应用到你的应用程序中，例如：

import { ThemeProvider } from '@mui/material/styles';

function MyApp() {
  return (
    <ThemeProvider theme={theme}>
      {/* 你的应用程序组件 */}
    </ThemeProvider>
  );
}

这样，你的应用程序中的 H1、H2、H3 标题就会使用你自定义的样式。