[分享]css两行两列表格

下面是一个使用CSS制作的两行两列表格示例：

HTML代码如下：

<div class="table">
  <div class="row">
    <div class="cell">单元格1</div>
    <div class="cell">单元格2</div>
  </div>
  <div class="row">
    <div class="cell">单元格3</div>
    <div class="cell">单元格4</div>
  </div>
</div>

CSS代码如下：

.table {
  display: table;
  border-collapse: collapse;
}
.row {
  display: table-row;
}
.cell {
  display: table-cell;
  border: 1px solid black;
  padding: 10px;
}

展示效果如下：