html - 有没有办法可以防止虚线边框合并？

Question

我将 border:dashed 应用于我的表格单元格，在某些地方，破折号与其他表格单元格的破折号合并。请参见下图。有没有一种方法可以在不直接将样式应用于行的情况下防止这种情况发生？

稍后编辑:我直接将样式应用到 tr 并得到相同的结果。

Answer 1

您必须折叠 table 元素的 border，所以摆脱它并使用 border-collapse: separate; 和 border-spacing: 1px; 改为

table {
    border-spacing: 1px;
    border-collapse: separate;
}

table tr td {
    border-bottom: 1px dashed #000;
}

Demo

Demo 2 (当边框折叠时看到 Angular )