TableRow材质-UI之间的间距

Question

我想在 TableRow MaterialUI 组件之间添加空间。我该怎么做？

<S.MainTable>
  <TableBody>
   {rows.map(row => {
     return (
       <S.StyledTableRow key={row.id}>
         <TableCell component="th" scope="row">{row.name}</TableCell>
         <TableCell numeric>{row.calories}</TableCell>
         <TableCell numeric>{row.fat}</TableCell>
         <TableCell numeric>{row.carbs}</TableCell>
         <TableCell numeric>{row.protein}</TableCell>
       </S.StyledTableRow>
           );
         })}
  </TableBody>
</S.MainTable>

Answer 1

将以下几行代码添加到表的CSS中：

{
     border-spacing: 0 5px !important;
     border-collapse: separate !important;
}

Answer 2

您是否使用了“ break”标签？或者您也可以使用边距和填充。