HTML如何动态显示元素，根据指定行列排列

可以使用 CSS 的 grid 布局来实现根据指定行列排列的动态元素布局。下面是一个示例代码，可以将动态元素按照每行 3 列的方式排列：

HTML：

<div class="grid-container">
  <div class="grid-item">1</div>
  <div class="grid-item">2</div>
  <div class="grid-item">3</div>
  <div class="grid-item">4</div>
  <div class="grid-item">5</div>
  <div class="grid-item">6</div>
  <div class="grid-item">7</div>
  <div class="grid-item">8</div>
  <div class="grid-item">9</div>
  <div class="grid-item">10</div>
  <div class="grid-item">11</div>
  <div class="grid-item">12</div>
</div>

CSS：

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 每行 3 列 */
  gap: 10px; /* 元素间隔为 10px */
}

.grid-item {
  background-color: #ddd;
  padding: 20px;
}

以上代码将会将网格容器分成三列，并将项目放置在每行的相应列中。您可以通过调整 grid-template-columns 属性的值来改变每行的列数。同时，还可以通过调整 gap 属性来设置元素之间的距离。