captionとは

captionの使用例［HTMLソースコード］

<table>
<caption>ホームページ作成サービス</caption>
<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>SEO対策</td>
  <td>キーワードの選定からホームページの構造設計まで</td>
  <td>○○円～</td>
 </tr>
</tbody>
</table>

captionの使用方法解説

　「caption要素」は、表組みのタイトル、または説明を表す要素です。
　「table要素」の子要素として最初に入れ、表の上部に表示されるテキストです。この「caption要素」内にテキスト関連要素として、「strong要素」や「p要素」などを利用することもできます。

「caption要素」の表示位置

　とくに位置を指定しない場合、「caption要素」は、表組みの上段、中央に表示されます。この表示位置は、CSSを利用して表組の下段や、「左揃え」「右揃え」などに変えることもできます。

HTML Source

<table>
<caption style="caption-side: bottom;">ホームページ作成サービス</caption>
 <tr>
  <th>サービス</th>
  <th>内容</th>
  <th>価格</th>
 </tr>
</table>