是否可以模拟表格单元格之间的间距，使得垂直和水平间距不同？

Question

在CSS中，您可以使用表格的border-spacing属性指定表格单元格之间的间距。

然而，这会导致列和行之间的间隔均匀，我发现更多情况下我使用的设计要求行之间的间隙，而不是列，或反之亦然。

如果我有一个坚实的背景，我可以使用与背景颜色相同的颜色来模拟间距。

我还可以创建一个div（例如）每个表格单元格的第一个子节点，并使用填充或边距来获得所需的结果，但这只是为了适应样式而需要额外的标记。

鉴于我显示的数据是表格数据，是否有一种合理的方法可以使用表格来实现这种风格？

Answer 1

您可以为border-spacing或相关属性指定水平和垂直边缘的不同间距。只需指定多个测量值即可。如，

border-spacing: 1px 2px;

Answer 2

在 一般情况 中，您可以在其中指定可以全局或单独在属性上应用的校准（例如，“填充”），请遵循一个简单的模式。

• 如果指定单个值（例如 填充：2px的; ）应用该值 到顶部，底部，左侧和右侧 对象。

• 如果指定两个值（例如 填充：2px 7px; ）第一个值 适用于顶部和底部 第二个是左边和右边。

• 如果指定三个值，则为 第一个值应用于顶部， 左边第二个值和 对，和最终的价值 底部。

• 如果指定四个值（例如 填充：1像素，2px的，3PX，4像素; ） 值应用于顶部，右侧， 底部，按顺序左移（使用单词TRouBLe记住顺序）。