html - 为什么我会得到不同的 HTML 表格大小？

Question

我有以下 HTML 片段：

<table>
 <tbody>
  <tr>
   <td><table>...</table></td>
   <td><table>...</table></td>
   <td><table>...</table></td>
   ...
   <td><table>...</table></td>
  </tr>
 </tbody>
</table>

这会导致此jsFiddle中表示的问题。我可以很容易地看到，在td第一层的每一层之间，都有一个table我不知道从哪里来的空间。这样做的结果是第一级表的宽度大于第二级表的宽度之和。您可以查看小提琴的警报弹出窗口以了解我的意思。

如何解决此问题以便获得相同的宽度？

注意：如果给出解释，我也将不胜感激。

Answer 1

您可以添加每个 td 第一级 css 属性，td 具有默认填充

td{
   margin:0; padding:0;
}

Answer 2

将此添加到父表以使宽度相同：

cellpadding="0" cellspacing="0"

工作小提琴：演示

如果你想减少空白，那么请减少子表的宽度，即大约 300px 左右。