如何将数据放在2个标题标签html的单行中

如何解决如何将数据放在2个标题标签html的单行中

我有下面的HTML代码

<table>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  </tbody>
</table>

以上数据在页面上加载良好。 2个带有月度和储蓄的标题，以及我从后端接收的两行数据。

当我没有从后端获取任何数据并且我想在第一行显示错误消息时，就会出现问题。我正在按照以下步骤进行操作

<table>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
      <td> No data to show because the request to load user info Failed</td>
</table>

如您所见，我想在第一行显示错误消息<td> No data to show because the request to load user info Failed。问题在于此数据本身已包装在第一列中，而我希望此错误消息分布在Month和Savings列中。

有人可以帮助我实现这一目标吗？

解决方法

您仍然需要添加tbody和tr，并且可以使用colspan元素上的td属性来“合并”列。例如，colspan="2"使一个单元格跨越两列。

<table>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td colspan="2">No data to show because the request to load user info failed</td>
    </tr>
  </tbody>
</table>