假设我们希望以符合HTML5的方式为表分配10px的“cellpadding”和15px的“cellspacing”。我将在这里展示两种方法，给出非常相似的输出。

两组不同的CSS财产应用于表的相同HTML标记，但概念相反：

第一个使用边界折叠的默认值（单独），并使用边界间距提供单元间距，第二个选项将边界折叠切换为折叠，并使用border属性作为cellspacing。

在这两种情况下，cellpadding都是通过为tds指定padding:10px来实现的，在这两个情况下，为它们指定的背景色只是为了更清晰的演示。

第一种方法：

表｛边框间距：15px｝td｛背景色：#00eb55；填充：10px；边框：0｝<表><tr><td>标题1</td><td>标题2</td></tr><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></table>

第二种方法：

表｛边框塌陷：塌陷｝td{背景色：#00eb55；填充：10px；边框：15px纯色#fff}<表><tr><td>标题1</td><td>标题2</td></tr><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></table>

此样式用于表格的完全重置-单元格填充、单元格间距和边框。

我的reset.css文件中有这样的样式：

table{
    border:0;          /* Replace border */
    border-spacing: 0px; /* Replace cellspacing */
    border-collapse: collapse; /* Patch for Internet Explorer 6 and Internet Explorer 7 */
}
table td{
    padding: 0px; /* Replace cellpadding */
}

此外，如果您希望cellspacing=“0”，请不要忘记在表的样式表中添加边框折叠：折叠。

用div包装单元格的内容，你可以做任何你想做的事情，但你必须将每个单元格包装在一列中，以获得统一的效果。例如，要获得更宽的左右边距：

因此CSS将是，

div.cell加宽器{边距：0px 15px 0px 15像素；}时差{填充：0px；}<table border=“0”><tr><td class=“紧”><div class=“cellwider”>我的内容</div></td></tr></table>

是的，这很麻烦。是的，它适用于Internet Explorer。事实上，我只在Internet Explorer上测试过这一点，因为这是我们在工作中允许使用的全部功能。

只需对表数据使用CSS填充规则：

td { 
    padding: 20px;
}

对于边框间距：

table { 
    border-spacing: 1px;
    border-collapse: collapse;
}

然而，由于box模型的diff实现，它可能会在旧版本的浏览器（如Internet Explorer）中产生问题。

据我所知，在表格单元格上设置边距实际上没有任何效果。单元格间距的真正CSS等价物是边框间距，但它在Internet Explorer中不起作用。

您可以使用border-collapse:collapse将单元格间距可靠地设置为0，如前所述，但对于任何其他值，我认为唯一的跨浏览器方法是继续使用cellspacing属性。