在 Material UI Typography 中将内容与变体作为标题对齐到中心

scr*_*obh 3 javascript css typography reactjs material-ui

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

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

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

Sai*_*m27 7

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>
  );
}
Run Code Online (Sandbox Code Playgroud)