Question

考虑以下HTML：

<table>
    <tr>
        <td>Born</td>
        <td><time datetime="1986-11-05">5<sup>th</sup> November 1986</time></td>
    </tr>
    <tr>
        <td>Gender</td>
        <td>Male</td>
    </tr>
    <tr>
        <td>Sports</td>
        <td>Football<br />Tennis</td>
    </tr>
    <tr>
        <td>Teams</td>
        <td>Liverpool FC<br />Spain FC</td>
    </tr>
</table>

是否可以在引用列而不是行时使用<th>？我希望左栏加粗。

Answer 1

是的，您可以对行或列中的单元格使用<th>。

<table>
    <tr>
        <th>Born</th>
        <td><time datetime="1986-11-05">5<sup>th</sup> November 1986</time></td>
    </tr>
    <tr>
        <th>Gender</th>
        <td>Male</td>
    </tr>
...

Answer 2

The spec清楚地表明th元素可以为列或行（或列或行组）提供标题信息。属性scope=row可用于明确表示标题单元格是行标题。

使用th与td有一些影响。功能含义是用户代理可以以特殊方式处理th，使用户通过相应的头信息访问数据单元。这主要适用于语音代理。为了使其有意义，th单元格应该真正提供数据行或数据列的标识信息。在这种情况下，满足条件。因此，您可以而且应该使用th代替td，而不是所需的渲染。

其他含义是默认情况下，th元素内容以粗体和水平居中呈现。如果这不合适，您可以轻松地在CSS（甚至HTML）中覆盖它。在您的情况下，如果您希望内容为粗体但左对齐，请使用th { text-align: left; }。（另一种可能更好的方式是右对齐行标题：th { text-align: right; }。居中可能看起来很奇怪。）

Answer 3

或者您可以将该css仅添加到第一列的粗体

table tr td:first-child{font-weight:bold;}

列而不是行？

3 个答案: