HTML / CSS格式：单元格<->单元格之间的真实间距，而不是单元格<->之间的任何间距

如何解决HTML / CSS格式：单元格<->单元格之间的真实间距，而不是单元格<->之间的任何间距

|| 我正在寻找有关表格单元格之间间距的提示。我知道 HTML中的

cellspacing

/ѭ1and及其等同于CSS的

border-spacing

/ѭ3they，但是按他们的名字做时，他们所做的比我期望的要多。我要实现的是该术语所隐含的单元间距：仅单元之间的间距，而不是单元与其周围的任何元素之间的间距。 这是一张图片，显示我的意思： 简而言之，我不需要红色箭头（即单元格和表格之间）所描绘的间距，但我确实希望两个相邻单元格之间的间距。是否有任何“简便”方法，还是我需要乏味的方法来为“边界”单元格与“内部”单元格分配不同的符号？     

解决方法

一个一直对我有用的简单解决方案（即使在IE中也是如此）是使表的负4大小与2大小相同。 快速而肮脏的示例：http://jsfiddle.net/rBkPQ/     ,试试这个：http://jsfiddle.net/dBSWV/ IE8不支持

:last-child

，因此，如果您需要IE6来工作，则需要使用ѭ7add并添加一个a8ѭ类。

table {
    border: 1px solid red
}
td > div {
    border: 1px solid #000;
    margin: 5px
}
tr:first-child > td > div {
    margin-top: 0
}
tr:last-child > td > div {
    margin-bottom: 0
}
td:first-child > div {
    margin-left: 0
}
td:last-child > div {
    margin-right: 0
}

<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
    <tr>
        <td><div>Content 1</div></td>
        <td><div>Content 2</div></td>
        <td><div>Content 3</div></td>
    </tr>
    ..
</table>

    ,可能是这样的：http://jsfiddle.net/H37BG/6/ 虚线边框是表格边框，您可以将其设置为无。 :)