reactjs React Material UI -如何将内容居中到页面中间

lnxxn5zx 于 2023-03-08 发布在 React

关注(0)|答案(2)|浏览(200)

此时按钮正在左上角输出，如何将按钮移到页面中间？

import {Button} from '@mui/material';

function App() {
  return (
      <Button variant="contained">Hello World</Button>
  );
}

export default App;

尝试以上代码，但显然需要更多的变化，以中心

reactjs

来源：https://stackoverflow.com/questions/75659114/react-material-ui-how-to-centre-contents-to-the-middle-of-the-page

2条答案

按热度按时间

wpx232ag1#

您可以使用Box标记：

<Box textAlign='center'>
  <Button variant='contained'>
     Hello World
  </Button>
</Box>

赞(0）回复(0）举报 2023-03-08

qaxu7uf22#

如果不想添加自定义样式，则必须使用网格

import { Button, Grid } from "@mui/material";

function App() {
  return (
    <Grid container justifyContent="center" alignItems="center">
      <Button variant="contained">Hello World</Button>
    </Grid>
  );
}

export default App;

赞(0）回复(0）举报 2023-03-08

我来回答

reactjs React Material UI -如何将内容居中到页面中间

2条答案

相关问题

热门标签

最新问答