我意识到这是对一个旧线程的回答，可能不是所要求的解决方案，但尽管所有建议的解决方案都没有达到我所需要的效果，但这个解决方案对我有效。

我有两个表格单元格，一个带有背景色，另一个带有边框色。上述解决方案删除了边界，因此右侧的单元格看起来像漂浮在半空中。成功的解决方案是用div和相应的类替换table、tr和td：table将是div id=“table_replacer”，tr将是div class=“tr_replaceer”，td将是div class=“td_replacer“（显然也将结束标记更改为div）

为了解决我的问题，css是：

#table_replacer{display:table;}
.tr_replacer {border: 1px solid #123456;margin-bottom: 5px;}/*DO NOT USE display:table-row! It will destroy the border and the margin*/
.td_replacer{display:table-cell;}

希望这对某人有所帮助。

最好的方法是使用高度属性添加＜td＞：

<td height="50" colspan="2"></td>

你可以在这里阅读更多关于colspan的信息。

在下面的示例中，我们的表是绿色的，具有高度属性的td是黄色的：

<table style=“background color:green”><tr><td><span>洛雷姆</span></td><td><span>Ipsum公司</span></td></tr><tr><td height=“50”colspan=“2”style=“background color:yellow”></td></tr><tr><td><span>坐下</span></td><td><span>阿梅特</span></td></tr></table>

您需要在td元素上使用填充。像这样的东西应该会奏效。当然，您可以使用顶部填充而不是底部填充获得相同的结果。

在下面的CSS代码中，大于号表示填充仅应用于td元素，这些元素是带有spaceUnder类的tr元素的直接子元素。这将使使用嵌套表成为可能。（示例代码中的单元格C和D）我不太确定浏览器是否支持直接子选择器（想想IE 6），但它不应该破坏任何现代浏览器中的代码。

/*对类spaceUnder的tr元素的直接子级td元素应用填充*/tr.spaceUnder>td{衬垫底部：1毫米；}<表><tbody><tr><td>一个</td><td>B级</td></tr><tr class=“spaceUnder”><td>C类</td><td>D）</td></tr><tr><td>电子</td><td>F级</td></tr></tbody></table>

这应该有点像这样：

+---+---+
| A | B |
+---+---+
| C | D |
|   |   |
+---+---+
| E | F |
+---+---+

好的，你可以

tr.classname td {background-color:red; border-bottom: 5em solid white}

确保背景色设置在td而不是行上。这应该适用于大多数浏览器。。。（铬，即已测试）

执行上述操作。。。

table tr{ float: left width: 100%; }  tr.classname { margin-bottom:5px; } 

删除垂直列对齐方式，因此使用时要小心

您是否尝试过：

tr.classname { margin-bottom:5em; }

或者，也可以调整每个td：

td.classname { margin-bottom:5em; }

or

 td.classname { padding-bottom:5em; }