14

HTMLテーブルについて学んだとき、tbody、thead、tfoot、colgroupについては教えられませんでした。いつ使うの？私はW3Schoolsサイトにアクセスしましたが、それらがどのように機能するかは理解していますが、いつ使用するか、使用しないかはわかりません。

4

1 に答える 1

8

テーブルに関する追加情報を提供し、テーブル内のコンテンツを整理する場合に使用します。また、いくつかの点でテーブルの視覚的なレンダリングに影響を与える可能性があります（ただし、これはブラウザによって異なる場合があります。たとえば、<colgroup>/のサポート<col>は非​​常にパッチがあります）。

たとえば、上部と下部にヘッダー行がある場合、それらをそれぞれa<thead>とaにグループ化し<tfoot>、データ行を。にグループ化します<tbody>。ブラウザは、要素1<tfoot>の前後に配置するか、テーブルにあるデータの量に関係なく、常に下部にレンダリングされる<tbody>ようにします。これは、テーブルに多数の行が含まれる可能性がある場合に役立ちます。<tr>

<table>
  <caption>High Scores</caption>
  <thead>
    <tr><th>#</th><th>Name</th><th>Score</th></tr>
  </thead>
  <tfoot>
    <tr><th>#</th><th>Name</th><th>Score</th></tr>
  </tfoot>
  <tbody>
    <tr><td>1</td><td>Alice</td><td>10000</td></tr>
    <tr><td>2</td><td>Bob</td><td>9000</td></tr>
    <tr><td>3</td><td>Carol</td><td>8500</td></tr>
    <tr><td>4</td><td>Dave</td><td>8000</td></tr>
    <!-- Up to 100 data rows -->
  </tbody>
</table>

それ以外の場合、デフォルトでは、すべての行が1つにグループ化されます（テーブル内でタグ<tbody>を明示的に使用しない場合でも）。<tbody></tbody>したがって、テーブルの下部にヘッダー行がある場合、それらを最後に表示するには、テーブルの一番下にヘッダー行を配置する必要があります。

<table>
  <caption>High Scores</caption>
  <tr><th>#</th><th>Name</th><th>Score</th></tr>

  <tr><td>1</td><td>Alice</td><td>10000</td></tr>
  <tr><td>2</td><td>Bob</td><td>9000</td></tr>
  <tr><td>3</td><td>Carol</td><td>8500</td></tr>
  <tr><td>4</td><td>Dave</td><td>8000</td></tr>
  <!-- Up to 100 data rows -->

  <tr><th>#</th><th>Name</th><th>Score</th></tr>
</table>

そしてもちろん、これはまた、あなたがその種のことを気にかけているなら、それをおそらく意味論的ではなくします。

1 を使用する場合は、HTML4およびXHTML1までの以前の仕様の要素の前に配置して、これらのDoctypeに対して検証する必要があることに注意してください。これは、 HTML5以降では当てはまりません。<tfoot><tbody><tr>

于 2013-03-15T19:41:06.823 に答える