HTML行列表头表格优化：如何使列表头从第1行第1列起始？

要让列表头从第1行第1列开始，只需将第一行的空<td>替换为带scope="col"的<th>元素，并填写对应表头文本（比如匹配行表头的分类名称，这里用「存储层级」适配场景）。

修改后的完整代码：

<table>
  <caption>Volumes Consumption</caption>
  <tr>
    <th scope="col">存储层级</th>
    <th scope="col">Performance Tier</th>
    <th scope="col">Contracted Value</th>
    <th scope="col">Consumed Value</th>
    <th scope="col">Contract Numbers</th>
  </tr>
  <tr>
    <th scope="row">Extreme-MC</th>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
  </tr>
  <tr>
    <th scope="row">Premium-MC</th>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
  </tr>
  <tr>
    <th scope="row">Premium</th>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <th scope="row">Value</th>
    <td>4</td>
    <td>4</td>
    <td>4</td>
    <td>4</td>
  </tr>
</table>

关键修改说明： #

• 移除原第一行的空<td></td>，替换为<th scope="col">存储层级</th>，让第一行第一列成为正式列表头
• 保留其他列表头的scope="col"属性，保证HTML语义化正确
• 行表头的scope="row"属性无需改动，仍维持每行分类标识的语义

内容的提问来源于stack exchange，提问作者user1400953