如何在一个垂直列中创建包含标题的HTML表格？

Question

我想创建一个HTML文件，其中包含一个垂直列中的标题，以及右侧列中的数据。总共只有2列。我查看了html文档并看到了有关范围的内容，但我不完全确定如何在此上下文中使用它。示例：

Answer 1

HTML非常简单，只需确保使用[scope] attribute指定表格的正确方向。

<table>
    <tbody>
        <tr>
            <th scope="row">City</th>
            <td>$city</td>
        </tr>
        <tr>
            <th scope="row">Latitude</th>
            <td>$latitude</td>
        </tr>
        <tr>
            <th scope="row">Longitude</th>
            <td>$longitude</td>
        </tr>
        <tr>
            <th scope="row">Country</th>
            <td>$country</td>
        </tr>
    </tbody>
</table>

来自[scope]属性的文档：

  

行状态表示标题单元格适用于同一行中的某些后续单元格。

Answer 2

您可以创建包含元素的表格，如下所示：

<table> 
<tr>
    <th scope="row">Category 1</th><td>data1</td>        
</tr>   
<tr>
    <th scope="row">Category 2</th><td>data2</td>        
</tr>  
<tr>
   <th scope="row">Category 3</th><td>data3</td>         
</tr>

以下是其中的一个示例：

vertical headers