Javascript 如何将cardHeader组件中的化身元素居中？

我正在为前端项目使用材质ui，我有显示数据的卡片。我想在中间的卡片上显示一个化身。我使用一个卡头插入我的头像，但无法将其居中。我尝试在media style类中将alignContent和textAlign设置为居中，但没有帮助

我应该怎么做才能实现中心对齐？让我知道我是否应该使用除cardHeader以外的其他工具

<CardHeader
     className={classes.media}
     avatar={<Avatar alt="Alias" src={alias1} className={classes.small} />}
   />

更新：我通过在“small”类中将marginLeft和marginRight指定为“auto”得到了结果。但是公认的答案也适用。

试试这个

style={{ justifyContent: "center", display: "flex" }}

---

CardHeader

需要一个

title

，该标题使用

flex:1 auto

样式呈现，无论您是否提供

title

道具。这就是阻止您在

媒体

类样式中使用

justifyContent

的原因

有几种方法可以实现这一点，但如果您不使用其他

CardHeader

道具，我只需将其替换为

Box

或

Grid

const{Card，Box，Avatar，CardContent，排版，makeStyles}=MaterialUI
const useStyles=makeStyles({
根目录：{
背景色：“eeeeee”，
最大宽度：400
}
});
函数MyCard（）{
const classes=useStyles（）；
返回(
我的同僚们不愿意为精英们献身
暂时性透明剂
阿特克·诺比斯。
);
}
ReactDOM.render（，document.getElementById（'root'））

---

它不起作用，但谢谢