Question

这里，表头和表体中的列/单元之间没有间隙。我需要在表头的列之间留出空间，但是表体中的列之间应该没有间隙。

如何仅在android:checkableBehavior="single"中的列之间包含空格。即边界空间？

以下是我尝试过的代码。

thead

table.OrderDetail {
    font-family: Arial;
    border-collapse: collapse;
}
.OrderDetail tbody {
    padding: 10px;
    text-align: left;
    font-size:13px;
    font-family: Arial;
}
.OrderDetail thead {
    padding: 7px;
    text-align: left;
    background-color: #E0E0E0;
    color:#989898;
    font-size:10px;
}
.OrderNumber {
    font-family: Helvetica, Arial, sans-serif;
    background-color: #99CCFF;
    text-align: left;
}
.OrderNumber thead {
    font-size:10px;
}
.OrderNumber tbody {
    font-size:15px;
}
tr.separating_line td {
    border-bottom: 1px solid gray; /* set border style for separated rows */
}
.OrderDetail td {
    padding: 10px 0; /* 10px top & bottom padding, 0px left & right */
}
.OrderDetail th {
    padding: 5px 0; /* 10px top & bottom padding, 0px left & right */
}

我使用了border-collapse：在桌面崩溃。这使得所有边界连续。我需要它是身体的连续体而不是桌子头部的连续体。它甚至可能吗？

Answer 1

这可能就是你所追求的。您需要直接定位细胞。

.OrderDetail thead th { padding: 7px; }
.OrderDetail tbody td { padding: 3px; }

Answer 2

也许这对你有帮助吗？设置第三个单元格的边框宽度。它会在标题之间进行分离，我认为这就是你要求的......？

.OrderDetail th {
    padding: 5px 0; /* 10px top & bottom padding, 0px left & right */
    border-right: 5px solid white;
}
.OrderDetail th:last-child {
    border-right: 0;
}

jsfiddle

如何为表头和表体提供单独的边界单元间距

2 个答案: