您可以使用border-spacing属性：

HTML：

<div class="table">
    <div class="row">
        <div class="cell">Cell 1</div>
        <div class="cell">Cell 2</div>
    </div>
</div>

CSS：

.table {
  display: table;
  border-collapse: separate;
  border-spacing: 10px;
}

.row { display:table-row; }

.cell {
  display:table-cell;
  padding:5px;
  background-color: gold;
}

还有其他选择吗？

好吧 ，不是真的。

为什么？

• margin属性不适用于display: table-cell元素。
• padding 属性不会在单元格的边缘之间创建空间。
• float属性破坏了table-cell能够与其父元素一样高的元素的预期行为。