我試著編輯各種CSS、表格元素和表格單元格，但我仍然無(wú)法消除這些線條。在材質(zhì)UI中，如何使表格元素的行與行之間沒有線條？

正如Soothran在評(píng)論中提到的，這是由TableCell的底部邊框控制的。下面是一種定制的方法。

import MuiTableCell from "@material-ui/core/TableCell";

const TableCell = withStyles({
  root: {
    borderBottom: "none"
  }
})(MuiTableCell);

如果你使用的是MUI v5，你可以使用sx道具。新的MUI版本還添加了tableCellClasses對(duì)象，以幫助您以類型安全的方式引用組件CSS className，而不是使用硬編碼的字符串& quot多表單元格-根& quot：

import Table from "@mui/material/Table";
import TableCell, { tableCellClasses } from "@mui/material/TableCell";

<Table
  sx={{
    [`& .${tableCellClasses.root}`]: {
      borderBottom: "none"
    }
  }}
>

現(xiàn)場(chǎng)演示

要?jiǎng)h除特定表格單元格的邊框線，請(qǐng)使用:

<TableCell style={{borderBottom:"none"}}></TableCell>

要?jiǎng)h除特定表格行的邊框，您可以使用:

sx={{ "& td": { border: 0 } }}

classes={{ root: classes。TableCell的MuiTableCell } }類，然后 多表單元格:{ borderBottom:“無(wú)” }

這讓我可以很好地移除表格單元格的邊框底部線。

要?jiǎng)h除表格邊框線:

。多重?cái)?shù)據(jù)網(wǎng)格-根。多數(shù)據(jù)網(wǎng)格單元格{border-bottom:無(wú)！重要；}