如何在不使用边框间距的情况下添加表中行之间的间距？-css教程-PHP中文网

如何在不使用边框间距的情况下添加表中行之间的间距？

Patricia Arquette

发布： 2024-11-10 02:30:02

原创

899 人浏览过

How to Add Spacing Between Rows in a Table Without Using Border-Spacing?

表格中的行间距

在表格行之间添加垂直间距可增强可读性和视觉吸引力。虽然 border-spacing 似乎是此目的的理想属性，但它只影响表格单元格之间的间距。为了实现行间距，我们必须探索替代解决方案。

关键在于调整各个表格数据单元格（

元素）的填充。这是一个 CSS 解决方案：

tr.spaceUnder > td {
  padding-bottom: 1em;
}

登录后复制

在此代码中，我们以类“spaceUnder”的表行的直接子级 (>) 为目标。这允许选择性间距，这在嵌套表格场景中非常有用。

“padding-bottom”属性定义单元格内容下方的垂直间距。根据需要调整该值以获得首选的行间距。通过填充单元格的底部，我们可以有效地在单元格与其下方的行之间创建间隙。

因此，虽然边框间距在这种情况下不适用，但填充提供了一种控制行间距的有效方法在表格中。

以上是如何在不使用边框间距的情况下添加表中行之间的间距？的详细内容。更多信息请关注PHP中文网其他相关文章！