在table布局中用div

在HTML中，使用`<table>`标签可以创建表格布局，而如果想要使用`<div>`元素来模拟类似的效果，通常是在CSS控制下实现所谓的“流式布局”或“网格布局”。`<div>`元素主要用于容器，可以用来组织内容并应用样式，比如水平居中、弹性布局（Flexbox）或网格布局（Grid）。

使用`div`进行table布局示例：

<div class="grid-container">
  <div class="grid-item">Row 1, Col 1</div>
  <div class="grid-item">Row 1, Col 2</div>
  <div class="grid-item">Row 1, Col 3</div>

  <div class="grid-item">Row 2, Col 1</div>
  <!-- 更多行和列... -->
</div>

然后通过CSS设置：

.grid-container {
  display: grid;
  /* 可以设置网格列数、间距等 */
  grid-template-columns: repeat(3, 1fr);
}

.grid-item {
  padding: 10px; /* 控制单元格内边距 */
}

这里`display: grid;`开启网格布局，并使用`grid-template-columns`定义列的数量。每个`.grid-item`就是独立的单元格。