为什么cellspacing在这个表中不起作用？

Question

<table cellspacing="2" cellpadding="2">
<tr>
<td>123
</td>
</tr>
<tr>
<td>345</td>
</tr>
<tr>
<td>456</td>
</tr>
</table>

在这里，我想在行和列之间留一个空格，但是这个单元格间距不起作用。我做错了什么？

Answer 1

您提供的标记按预期工作，在单元格之间创建了2px的间距。当为单元格指定背景颜色时，这一点会变得很明显。

也就是说，不应该使用<table>元素have been deprecated和的cellspacing和cellpadding属性。

要创建与cellspacing和cellpadding相同的样式，可以使用CSS属性：

<table>上<td>

• border-spacing上的
• padding。border-collapse属性需要保留为默认separate。

边框间距CSS属性指定相邻单元格的边框之间的距离(仅适用于分离边框模型)。这等同于表现性超文本标记语言中的cellspacing属性，但可选的第二个值可用于设置不同的水平和垂直间距。

示例

​

table {
  border-spacing: 20px;
  background: #E91E63;
}
td {
  background: #F00;
  padding: 10px;
  background: #FCE4EC;
}

<table>
  <tr>
    <td>123</td>
  </tr>
  <tr>
    <td>345</td>
  </tr>
  <tr>
    <td>456</td>
  </tr>
</table>

​

Answer 2

您设置的默认值为2，尝试增加它，您将看到它正在工作