Html 如何在垫行之间应用边界半径和间距？

这是我的密码

我正在尝试使行显示如图所示，如下所示：

[边距属性]适用于除具有 表标题、表和内联表以外的表显示类型 基本上不能直接向表格行添加边距或填充。

如何为表行设置边框并指定边距和填充取决于所使用的边框模型（折叠或分开）

分开

在分离边界模型中，边与边界重合 细胞边缘。（因此，在这个模型中，可能存在 行、列、行组或列组，对应于 “边框间距”属性。）

在此模型中，每个单元都有一个单独的边框。这个 “边框间距”属性指定边框之间的距离 相邻细胞的。（…）行、列、行组和列组 不能有边框（即，用户代理必须忽略边框 这些元素的属性）

崩溃

中的行、列、行组和列组的边 折叠边界模型与上的假设网格线重合 单元格的边框居中。（因此，在这个模型中， 这些行一起完全覆盖了表格，没有留下任何间隙；对于 （这些列）

在折叠边界模型中，可以指定 包围单元格、行、行组、列和列的全部或部分 小组。（…）此外，在此模型中，表没有填充（但 没有利润）

因为在代码中，边界模型是独立的，所以您应该使用这些css集

table {
  width: 100%;
  border-spacing: 0 8px !important;
}

td.mat-cell {
 padding: 16px 0 16px 0;
 border-bottom: 2px solid #ffa600;
 border-top: 2px solid #ffa600;
}

td.mat-cell:first-child {
  border-left: 2px solid #ffa600;
  border-bottom-left-radius: 10px;
  border-top-left-radius: 10px;
}

td.mat-cell:last-child {
  border-right: 2px solid #ffa600;
  border-bottom-right-radius: 10px;
  border-top-right-radius: 10px;
}

我为你创造了一个新的世界