tableにはcaptionタグを使おう

この問題では、表のタイトルや説明を指定する要素であるcaptionタグについて学習していきます。 表関連のタグは多いですが、これらを適切な場面で指定することで検索エンジンに高く評価されやすくなります。 問題に挑戦して覚えていきましょう。

あらかじめエディタに書くコード

                    <table border="1">
  <thead>
    <tr>
      <th>見出し部分</th>
      <th>見出し部分</th>
      <th>見出し部分</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>内容部分</td>
      <td>内容部分</td>
      <td>内容部分</td>
    </tr>
    <tr>
      <td>内容部分</td>
      <td>内容部分</td>
      <td>内容部分</td>
    </tr>
    <tr>
      <td>内容部分</td>
      <td>内容部分</td>
      <td>内容部分</td>
    </tr>
  </tbody>
</table>
¥HTML¥
                

期待する画面

補足

captionタグはh1やh2などと同じ見出しタグになりますが、
文字の大きさは変わりません。
基本的に文字の大きさや太さを変更したい場合はCSSを使いましょう。

captionタグとは

captionタグとは、表のタイトルや見出しをつける際に使用されるHTMLのタグです。
captionタグはtable開始タグの直後に1つだけ記述します。
テーブルに対するタイトルの表示位置はalign属性で指定が可能です。表の上部に表示したい場合は、「top」もしくは指定なし、表の下部に表示させたい場合は、「bottom」を指定します。どちらも自動的に中央寄せになります。
しかし、これらの属性は非推奨とされているので注意が必要です。