Question

我正在使用@material-ui中的Grid来显示我的数据。在此网格内部，我还有多个其他网格，每个网格代表一个不同的部分。我已经使用了Grid的container spacing属性，并为其赋予了最大值（40），但是我需要将其间距增大一窝，而且我不知道该怎么做。 >

  <Paper className={this.props.classes.root}>
  <Grid container spacing={40} >
    <Grid item sm={6}>
      ..
    </Grid>
    <Grid item sm={2}>
      ..
    </Grid>
    <Grid item sm={4}>
    ..
    </Grid>
  </Grid>
  </Paper>

如何扩大间距？

Answer 1

通常spacing道具会在网格中的元素之间添加填充。因此您可以使用className或inline样式来实现元素之间的填充。

下面提供内联样式的示例代码。

<Grid container >
    <Grid item sm={6} style={{padding:'30px'}}>
      ..
    </Grid>
    <Grid item sm={2} style={{padding:'30px'}}>
      ..
    </Grid>
    <Grid item sm={4} style={{padding:'30px'}}>
    ..
    </Grid>
  </Grid>

反应如何扩大间距

1 个答案: