在HTML5中表示空TH的最佳方法是什么?

Sup*_*tar 10 html html5 html-table semantic-markup

说我有给定的表:

       +------+------+------+
       | Col1 | Col2 | Col3 |
+------+------+------+------+
| Row1 | D1.1 | D1.2 | D1.3 |
+------+------+------+------+
| Row2 | D2.1 | D2.2 | D2.3 |
+------+------+------+------+
| Row3 | D3.1 | D3.2 | D3.3 |
+------+------+------+------+
Run Code Online (Sandbox Code Playgroud)

我想在HTML5中代表它.棘手的是,像这样的表必须在语义上很重要,但左上角的单元格在语义上并不重要,而是使用间隔符来排列更重要的列标题.最好的方法是什么?我的第一个想法就是这样做:

<table>
    <thead>
        <tr>
            <th></th>
            <th>Col1</th>
            <th>Col2</th>
            <th>Col3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>Row1</th>
            <td>D1.1</td>
            <td>D1.2</td>
            <td>D1.3</td>
        </tr>
        <tr>
            <th>Row2</th>
            <td>D2.1</td>
            <td>D2.2</td>
            <td>D2.3</td>
        </tr>
        <tr>
            <th>Row3</th>
            <td>D3.1</td>
            <td>D3.2</td>
            <td>D3.3</td>
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

但是,放在<th></th>那里感觉错了,就像<p>&nbsp;</p>用于间距一样.有一个更好的方法吗?

Bol*_*ock 7

<th>从有效性或语义两个方面来说,拥有一个空元素是完全可以接受的.规范中没有任何内容禁止它; 实际上,它包含至少一个为同一目的而使用空的示例<th>:

以下显示了如何标记Apple,Inc在2008财年的10-K文件中的第46页的毛利率表:

<table>
 <thead>
  <tr>
   <th>
   <th>2008
   <th>2007
   <th>2006
 <tbody>
  <tr>
   <th>Net sales
   <td>$ 32,479
   <td>$ 24,006
   <td>$ 19,315
 <!-- omitted for brevity -->
</table>
Run Code Online (Sandbox Code Playgroud)

  • @JoshC:有些例子有结束标签,有些没有.我想这只是他们的说法,对于大多数表格元素来说,结束标签是可选的 - 它们就是这样. (2认同)