html - 如何在一个垂直列中制作带有标题的 HTML 表格？

Question

我想制作一个 HTML 文件，其标题位于一个垂直列中，数据位于右侧列中。总共只有 2 列。我查看了 html 文档并查看了有关范围的内容，但我不完全确定如何在这种情况下使用它。例子：

Answer 1

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

<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>

这是它的一个例子：

垂直标题