HTML怎么回显多条对应数据,css如何实现左右布局，并实现左右侧数据对应显示...

对于HTML回显多条对应数据，可以使用HTML表格（table）来实现。将需要回显的数据放在表格的每一行中，每一列对应不同的数据项。例如：

<table>
  <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>性别</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>25</td>
    <td>男</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>30</td>
    <td>男</td>
  </tr>
  <tr>
    <td>王五</td>
    <td>28</td>
    <td>女</td>
  </tr>
</table>

这样就可以将多条对应数据以表格的形式呈现出来。

对于CSS实现左右布局，并实现左右侧数据对应显示，可以使用CSS的flex布局。将需要显示的数据分为左右两个部分，分别放在一个父元素下，通过设置父元素的`display:flex`，可以使得左右两个部分并排显示。例如：

<div class="container">
  <div class="left">
    <h2>左侧数据</h2>
    <p>左侧数据内容</p>
  </div>
  <div class="right">
    <h2>右侧数据</h2>
    <p>右侧数据内容</p>
  </div>
</div>

.container {
  display: flex;
}

.left {
  flex: 1;
}

.right {
  flex: 1;
}

这样就可以实现左右布局。对于左右侧数据对应显示，可以在左侧和右侧数据中添加相同的类名，并使用CSS选择器进行样式设置。例如：

<div class="container">
  <div class="left">
    <h2 class="title">左侧数据</h2>
    <p class="content">左侧数据内容</p>
  </div>
  <div class="right">
    <h2 class="title">右侧数据</h2>
    <p class="content">右侧数据内容</p>
  </div>
</div>

.container {
  display: flex;
}

.left {
  flex: 1;
}

.right {
  flex: 1;
}

.title {
  font-size: 20px;
  color: #333;
}

.content {
  font-size: 16px;
  color: #666;
}

.left .title::after {
  content: "：";
}

.right .title::after {
  content: "：";
}

.left .title::before {
  content: "左侧";
}

.right .title::before {
  content: "右侧";
}

这样就可以实现左右侧的数据对应显示，其中`::after`和`::before`是CSS伪元素，可以在元素的前面或后面添加内容，用于实现左右侧数据的冒号和名称。