Material ui 如何在matrial ui排版中添加更多变体

在设计中，我的风格，我有更多的风格，然后标题

带衬线排印的h1

h1带有圣衬线排版

对于相同的H标记名，是否要有更多的变体！？要将其添加到

createMuiTheme

覆盖组件样式，然后使用h1变量：

import React from "react";

import Typography from "@material-ui/core/Typography";
import { withStyles } from "@material-ui/core/styles";

const SerifTypography = withStyles({ root: { fontFamily: "serif" } })(
  Typography
);
const SansSerifTypography = withStyles({ root: { fontFamily: "sans-serif" } })(
  Typography
);

export default function App() {
  return (
    <>
      <SerifTypography variant="h1">Serif</SerifTypography>
      <SansSerifTypography variant="h1">Sans Serif</SansSerifTypography>
    </>
  );
}

从“React”导入React；
从“@material ui/core/Typography”导入排版；
从“@material ui/core/styles”导入{withStyles}”；
const seriftyphography=withStyles（{root:{fontFamily:“serif”}}）(
印刷术
);
const SansSerifTypography=withStyles（{root:{fontFamily:“sans serif”}}）(
印刷术
);
导出默认函数App（）{
返回(
衬线
无衬线
);
}

现场演示：