カスタム検索

テーブルの表題と項目名

テーブルには、表題と項目名を表示することがよくあります。表題には<caption>を、項目名には<th>を使用します。

caption.html
<html>
    <head>
        <title>表題と項目名を定義したテーブルの例</title>
    </head>
    <body>
        <h1>表題と項目名を定義したテーブルの例</h1>
        <table border="1">
            <caption>従業員名簿</caption>
            <tr>
                <th>名前</th>
                <th>性別</th>
                <th>部署</th>
            </tr>
            <tr>
                <td>山田太郎</td>
                <td></td>
                <td>営業課</td>
            </tr>
            <tr>
                <td>鈴木花子</td>
                <td></td>
                <td>経理課</td>
            </tr>
            <tr>
                <td>佐藤一郎</td>
                <td></td>
                <td>製造管理課</td>
            </tr>
        </table>
    </body>
</html>

<caption>タグ

<caption>タグは、表題を指定します。通常、ブラウザはテーブルの幅に合わせて、中央揃えで表示します。

<th>タグ

<th>タグ(Table-header)で項目名となるセルを定義します。通常、ブラウザは<th>で定義されたセルの中のテキストや画像などを中央揃えで配置し、テキストはボールド体で表示されます。

まとめ
  • <caption>で表題を定義
  • <th>で項目名のセルを定義
CopyLeft 2017 Webデザインレッスン プライバシーポリシー サイト管理者に連絡