楽して作るほめぱげ 〜テーブル基本形〜

前に戻る 次に進む 目次に戻る 文芸班に戻る


 テーブルタグの説明です。
 慣れないと結構面倒なものなんですけど、これほど使い勝手のいいタグもないので、本腰入れて覚えましょう。
 尚、色々とゴチャゴチャしたオプションもあるのですが、うちのページで使っているオプションしかやりません。他のオプションを知りたかったり使いたかったりしたければ、くどいようですが自分で調べる事。

<table border="*" width="**" height="**" align="***">
 <tr align="***" valign="***">
  <td align="***" valign="***">
   項目
  </td>
 </tr>
</table>

<table border="*" width="**" height="**" align="***">   ←ここからテーブル組みま〜す
 <tr align="***" valign="***">   ←1行目の始まり〜
  <td align="***" valign="***">   ←1行目の1つ目の項目で〜す
   項目
  </td>   ←1つ目の項目終了
 </tr>   ←これで1行目を終りま〜す
</table>   ←ここでテーブルも終了〜


 閉じタグは入れなくてもいいらしいのですが、入れないと表示がおかしくなったり、後で自分で見直した時に訳が判らなくなりますので、絶対に入れましょう。

まずはテーブルタグのオプション
 テーブル枠を表示するか (border="*")
   テーブルの枠を表示するかどうかを決めます。「0」で非表示。設定なしで「1」。
 テーブルの横幅を設定 (width="**")
   テーブルの横幅を設定。数字を入れるとピクセル単位での設定。
  「**%」で設定すると、今開いているブラウザに対する%でテーブルが開きます。
 テーブルの縦幅を設定 (height="**")
   テーブルの縦幅を設定。数字を入れるとピクセル単位での設定。
  「**%」で設定すると、今開いているブラウザに対する%でテーブルが開きます。
 テーブルの表示位置 (align="***")
   テーブルをブラウザのどの位置で表示するかどうかを決めます。
  「left」「center」「right」で設定。設定なしで「left」。

次にtrタグ、tdタグのオプション
 セル内でのテキストの表示位置1 (align="***")
   テキストをセルのどの位置で表示するかを指定。
   「left」「center」「right」で設定。設定なしで「left」。
   trタグで設定した場合、その行全部に有効。tdタグで設定した場合、そのセルのみ有効。
 セル内でのテキストの表示位置2 (valign="***")
   テキストをセルのどの位置で表示するかを指定。
   「top」「middle」「bottom」で設定。設定なしで「middle」。
   trタグで設定した場合、その行全部に有効。tdタグで設定した場合、そのセルのみ有効。



<table border="0" width="100">
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr>
<td>4</td><td>5</td><td>6</td>
</tr>
</table>




<table border="1" width="150" align="center">
<tr>
<td valign=bottom>1</td><td>2222</td><td align="right">3333333333</td>
</tr>
<tr valign=middle>
<td>4 </td><td>555555</td><td align="center">66666</td> </tr>
</table>


22223333333333
55555566666






(C)1996-2003 Electric Artbox All-round Laboratory
Presented by Maki "PPCal" Miyahara
E-mail:cal@bf.mbn.or.jp