15

私は与えられたテーブルを持っているとしましょう:

       +------+------+------+
       | Col1 | Col2 | Col3 |
+------+------+------+------+
| Row1 | D1.1 | D1.2 | D1.3 |
+------+------+------+------+
| Row2 | D2.1 | D2.2 | D2.3 |
+------+------+------+------+
| Row3 | D3.1 | D3.2 | D3.3 |
+------+------+------+------+

そしてそれを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>

ただし、スペースに使用するなど、そこに置く<th></th>のは間違っているように感じます。これを行うより良い方法はありますか?<p>&nbsp;</p>

4

3 に答える 3

12

<th>有効性またはセマンティクスの観点から言えば、空の要素を持つことは完全に許容されます。仕様にはそれを禁止するものは何もありません。実際、まさにこの目的のために空を利用するが少なくとも 1 つ含まれています。<th>

以下は、2008 会計年度の Apple, Inc の 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
 <!-- snip -->
</table>
于 2013-11-07T17:32:12.713 に答える