HTML <th> col 属性

use*_*264 5 html

我只是想知道默认情况下 HTML<table>元素是否隐式地将属性 scope="col" 应用于<th>元素中包含的第一组<thead>元素?

当我在浏览器中呈现下面的第一组 HTML 时,它似乎会自动检测到<th>一月、二月、三月、四月等的单元格是列的标题。那么 scope="col" 是否不需要添加到标记中,因为它会以这种方式自动呈现?

 <table>
    <caption>2009 Employee Sales by Department</caption>
    <thead>
        <tr>
            <th></th>
            <th>Jan</th>
            <th>Feb</th>
            <th>March</th>
            <th>April</th>
            <th>May</th>
            <th>June</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">Firefox</th>
            <td>37.1</td>
            <td>36.6</td>
            <td>36.3</td>
            <td>35.8</td>
            <td>35.2</td>
            <td>34.4</td>
        </tr>
        </tr>   
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

第二组标记包括将 scope="col" 添加到 Jan、feb、March April 等标签中。是否有必要?正如上面的例子似乎<th>无论如何都将这些呈现为没有范围“col”的列。

我知道 scope 属性在普通 Web 浏览器中没有视觉效果,但可以被屏幕阅读器使用。那么是否应该为了更好的语义标记和可访问性而添加它?

<table>
        <caption>2009 Employee Sales by Department</caption>
        <thead>
            <tr>
                <th scope="col"></th>
                <th scope="col">Jan</th>
                <th scope="col">Feb</th>
                <th scope="col">March</th>
                <th scope="col">April</th>
                <th scope="col">May</th>
                <th scope="col">June</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th scope="row">Firefox</th>
                <td>37.1</td>
                <td>36.6</td>
                <td>36.3</td>
                <td>35.8</td>
                <td>35.2</td>
                <td>34.4</td>
            </tr>
            </tr>   
        </tbody>
    </table>
Run Code Online (Sandbox Code Playgroud)

Sir*_*rko 4

根据HTML5 规范,该scope属性默认为auto

范围属性的缺失值默认为自动状态。

该值的特点是

自动状态使标题单元格应用于基于上下文选择的一组单元格。

因此,我认为屏幕阅读器将能够正确检测上下文,这反过来意味着您不必显式定义该属性,除非您有一些特殊的实例或用例和rowgroupcolgroup

  • 尽管“基于上下文”的含义非常不清楚,并且规范中的示例远没有达到应有的帮助,但您的假设似乎是合理的。+1 (4认同)