4

私はテーブルをあまり使用しませんが、表形式のデータを取得すると、テーブルに入れられます。しかし、空のセルを使用する以外に、セルを整列させるためのより良い、または適切な方法があるかどうか疑問に思いました。

たとえば、各商品や価格などを1行にリストし、必要な数の行を追加するチェックアウトテーブルを使用しています。最後に、標準のサブ、配送、合計フィールドがあります。

今、彼らはすべて右側の最後のセクションを望んでいます、そしてこれは私が出くわしたかなり標準的なセットアップです。誰もがそのようにそれを持っているわけではありませんが、私がそれを見たのに十分です。だから私はそれに反対していませんが、それを行うために私が見ることができる唯一の方法は、整列を正しくするために多くの空のセルを追加することです。

<tr>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td>Sub-Total</td>
</tr>
<tr>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td><!--This cell should be empty--></td>
    <td>Total</td>
</tr>

私は通常、セマンティクスにかなり厳密に従おうとしているので、これは正しくないと感じます。私が何かを逃しているように。ただし、他の領域では、特定のデータがないために一部のセルが埋められません。つまり、1つの製品にオプションがあり、他の製品にはない場合です。したがって、これらのフィールドは空でなければならないため、間違いはありません。だから私は捕まり、これが正しいのか、間違っているのか、意見なのか、それとも何なのか本当にわかりません。

4

4 に答える 4

6

You can use the colspan attribute. You will likely want to right-align the text in that column with CSS:

<tr>
    <td colspan="6">Sub-Total</td>
</tr>
<tr>
    <td colspan="6">Total</td>
</tr>
于 2012-07-23T15:32:38.460 に答える
4

空のセルをと組み合わせてcolspan、値を分離したセルを保持します。結合されたすべてのセルが使用された最初の列に割り当てられるため、列ヘッダー（<th scope="col">）は間違ったセルを指していますcolspan。

于 2012-07-23T17:37:48.353 に答える
3

5つの空のセルの代わりに、を使用できます<td colspan="5"></td>。次に、小計または合計を含むセルを通常のセルとして含めることができます。これにより、セルを複数の列にまたがるように扱うのではなく、そのセルの配置を個別に処理できます。

空のセルはレンダリングでいくつかの問題を引き起こす可能性があります（この理由で&nbsp;コンテンツやCSSルールとして使用することをお勧めします）が、ここではロジックはほとんど問題になりません。empty-cells: show

ただし、最後の列に合計が含まれている最終行の場合（これがあなたが必要としているものであるかどうかは明確ではありません）、そこにいくつかの説明がある方がよいでしょう。

<tr>
   <td colspan="5">Total</td>
   <td>$42,000,000</td>
</tr>
于 2012-07-23T17:40:32.610 に答える
1

おそらく最良の方法は、colspan = "＃"これらの行がまたがる列の数を設定してから、align="right"を設定することです。

于 2012-07-23T15:33:18.583 に答える