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

Question

我有以下 HTML sn-p:

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

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

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

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

Answer 1

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

td{
   margin:0; padding:0;
}

Answer 2

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

cellpadding="0" cellspacing="0"

工作小提琴：Demo

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