javascript - 在 Material UI Typography 中将内容与变体居中对齐作为标题

Question

我有两个带有默认变体和标题变体的 Typography 元素。我如何使用 align="center" 属性将内容居中，并将变体作为标题，因为这似乎不起作用。

  render() {
    return (
      <div>
        <Typography align="center">Centered text</Typography>
        <Typography color="textSecondary" variant="caption" align="center">A Caption!</Typography>
      </div>
    );
  }

我使用 StackBlitz 创建了一个工作示例.有人可以帮忙吗？

Answer 1

import React from "react";
import Typography from "@material-ui/core/Typography";

export default function DisableElevation() {
  return (
    <div>
      <Typography align="center">Centered text</Typography>
      <Typography
        display="block"
        color="textSecondary"
        variant="caption"
        align="center"
      >
        A Caption!
      </Typography>
    </div>
  );
}