テーブル１

テーブルタグというのは「枠線を引くタグ」ですが、枠線を引くことより「細かいレイアウトができるデザインのためのタグ」としてよく利用されます。後者の使い方は本当は良くありません。

このタグは利用方法が難しいためマスターするのは大変ですが、一度マスターするともっともよく用いるタグの１つとなります。

テーブルタグ <table> 〜 </table>

言うより行うが易し、実際に作ってみましょう。

例 「*」は説明のための番号です。実際のHTMLには付いていません。 

<html>
  <head><title>テーブル</title></head>
  <body>

    <table border=1> *1
      <caption>シス研のパソコン</caption> *2
      <tr> *3
        <th>パソコン名</th><th>購入財源</th><th>OS</th> *4
      </tr>
      <tr>
        <td>Isao</td><td>部費</td><td>Windows</td> *5
      </tr>
      <tr>
        <td>Rumitech</td><td>K＆A</td><td>Windows/linux</td>
      </tr>
      <tr>
        <td>Apple２</td><td>教授</td><td>MAC</td>
      </tr>
    </table> *6

  </body>
</html>

説明

  1. 枠線１のテーブルを作製
  2. <caption>でテーブルの情報を示す。（省略可能）
  3. <tr> 〜　</tr>で１行の範囲を指定する。
  4. <th>　〜　</th>も基本的に<td>〜</td>と同じだが、「中身を強調する」性質がある。具体的にはセンタリングと太字にする。
  5. <td>　〜　</td>はテーブルの一つのセルに入れる情報を挟み込む。
  6. Tableの終了タグは絶対に忘れない。今回は４行×３列の表を作成。
prev top next