删除css中单元格之间的表格行和表格空间答案

【问题标题】：Removing table lines and table space between cells in css删除css中单元格之间的表格行和表格空间
【发布时间】：2011-06-30 17:30:14
【问题描述】：

我有这个网站：http://redditlist.com/dir/1026，我一直在尝试删除单元格之间的间距，所以它看起来更像这样：http://redditlist.com。

【问题讨论】：

【解决方案1】：

table#myTable{
  border-collapse:collapse;
}

【讨论】：

【解决方案2】：

使用border-collapse CSS 属性删除单元格之间的空格：

table {
    border-collapse: collapse;
}

默认情况下，您会看到表格单元格之间的间距，因为每个单元格都有自己的边框，单元格不共享边框。这称为“分离模型”，如Mozilla Developer CSS Reference 中所述：

分隔模型是传统的HTML表格边框模型。相邻的单元格都有自己独特的边界。它们之间的距离由border-spacing 属性给出。

您可以通过使单元格彼此共享边框来“移除”单元格之间的间距，这就是所谓的“折叠边框模型”：

在折叠边框模型中，相邻的表格单元格共享边框。

【讨论】：

抱歉，我刚刚看到 Jaspero 快了 2 分钟，我很欣赏这两个答案
@ulvund 你确定吗？我的时间戳是2011-06-30 17:31:52Z，Jaspero's 是2011-06-30 17:34:15Z。看来 I 是快 2 分钟的那个。另外，我链接到文档。

【解决方案3】：

试试这个

table.className td
{
    display: inline-block;
}

或

table.className td
{
    display: block;
}

【讨论】：

【解决方案4】：

试试

table td { display: table-cell; }

【讨论】：