在HTML表格中,单元格填充和单元格间距可以这样设置:

<table cellspacing="1" cellpadding="1">

如何使用CSS实现这一点?


当前回答

此黑客适用于Internet Explorer 6及更高版本、Google Chrome、Firefox和Opera:

table {
    border-collapse: separate;
    border-spacing: 10px; /* cellspacing */
    *border-collapse: expression('separate', cellSpacing = '10px');
}

table td, table th {
    padding: 10px; /* cellpadding */
}

*声明适用于Internet Explorer 6和7,其他浏览器将正确忽略它。

expression('separate',cellSpacing='10px')返回'separate',但这两个语句都运行,因为在JavaScript中,您可以传递比预期更多的参数,所有参数都将被求值。

其他回答

我用过!在边境崩溃后很重要

border-collapse: collapse !important;

它在IE7中对我有用。它似乎覆盖了cellspacing属性。

待定。对于所有使用CSS的问题,您最好只使用cellpadding=“0”cellspacing=“0“,因为它们没有被弃用。。。

显然,任何其他建议<td>利润的人都没有尝试过这一点。

td {
    padding: npx; /* For cellpadding */
    margin: npx; /* For cellspacing */
    border-collapse: collapse; /* For showing borders in a better shape. */
}

如果边距不起作用,请尝试将tr的显示设置为块,然后边距将起作用。

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

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

这个问题的简单解决方案是:

table
{
    border: 1px solid #000000;
    border-collapse: collapse;
    border-spacing: 0px;
}
table td
{
    padding: 8px 8px;
}