Question

我有一个带有一些colgroups的HTML表格，我放了一个边框。我想在相邻组之间添加一些空格。有没有办法在CSS中执行此操作而不在组之间添加空单元格？

<table>
  <colgroup style="border:1px solid blue;"><col><col></colgroup>
  <colgroup style="border:1px solid blue;"><col><col></colgroup>
  <thead>
    <tr><th>Col A1</th><th>Col A2</th><th>Col B1</th><th>Col B2</th></tr>
  </thead>
 <tbody>
    <tr><td>A1</td><td>A2</td><td>B1</td><td>B2</td></tr>
 </tbody>
</table>

所需的输出如下所示：

-------------------  -------------------
| COL A1 | COL A2 |  | COL B1 | COL B2 |
------------------   -------------------
|   A1   |   A2   |  |   B1   |   B2   |
-------------------  -------------------

修改

到目前为止看起来似乎没有办法用css做到这一点。我会等着看是否有人有答案可以实现这一目标，但就目前而言，我正在使用spacer-cell方法。它不是理想的，而是一个相对干净的解决方案。这是一个有效的例子：

http://jsfiddle.net/7ps6cuss/3/

Answer 1

margin＆amp; padding我的工作。

border-spacing仅适用于整个<table>元素。

我认为唯一的方法是将其分成两个单独的表。

修改

或使用border-right/left：http://jsfiddle.net/q5sksufo/
进行欺骗
*编辑：修复错误

Answer 2

试试这个：

colgroup{
    margin:20px;
}

在colgroups之间添加间距

修改

2 个答案: