＜ＴＡＢＬＥ＞①　作表の基本



　今回は＜TABLE＞タグです。
　テーブルというと、たいていの人が食卓のことを思い浮かべると思いまが、コンピュータ用語として使われる場合には、ほとんどの場合が「表」のことを表します。
　「タイムテーブル（時間割）」という言葉を、だれもが一度は聞いたことがあるはずです。
　この<ＴＡＢＬＥ＞タグはＨＴＭＬという言語の中でも最も面倒なタグです。．．．と僕は思います。
　碁盤の目型の単純な表ででもなければ、よほど頭を整理しておかないと面倒で作ろうという気にはなれません。特に、あとで表内の枠を分割したり、削除したいときには、きちんとしたレイアウト図でも残しておかなければ、訳がわからなくなる恐れがあります。
　僕なども、昔はＨＴＭＬコードはすべてテキストファイルへ手打ちしていましたが、このタグのせいで（お陰かな）ページ作成ソフトを使うようになりました。
　知識は知識として知っておいた方が後々のことを考えてもいいでしょうが、実際につくる場合はソフトを使ったほうがいいと思います。こんなところに労力を使うことを徒労というのでしょう。
　そんな暇があったら、もっと違うことを勉強した方があなたのためです。

　早速、使用例を見ていただきましょう。文字列の周りを枠で囲んだだけの表としては最も単純な例です。

例　<TABLE BORDER><TR><TD>最も単純な表</TD></TR></TABLE>
最も単純な表

　説明上、センタリングされていますが、実際には左寄りになります。以降の表も同様です。
　厳密にいえば、TABLEタグの属性、BORDERを省略できますが、これがなければ線が表示されませんので単なる文字列となります。これでは表とはいえないでしょう。


　上の例で、枠線が二重線であるかのように見えますが、実際にはこれで１本の線です。立体の線なのです。

　さて、＜ＴＡＢＬＥ＞タグは表の始まり、＜／ＴＡＢＬＥ＞タグは表の終わりを表します。この形式はいままでにも他のタグでたくさん出ていますからすでにおわかりかと思います。
　問題は＜ＴＲ＞や＜ＴＤ＞です。
　まず＜ＴＲ＞は表内のある行の内容をあらわすものです。正確ではありませんが、多分、Table Row（列）の略だと思います。
　そして、その中にある＜TD＞＜/ＴＤ＞のセットはその行のデータ要素を表します。これはTable　Dataの略でしょう。
　たとえば１行３列の表を作るときは次のような書き方をします。


 <TABLE BORDER><TR><TD>１番目のデータ</TD><TD>２番目のデータ</TD><TD>３番目のデータ</TD></TR></TABLE>
　

１番目のデータ２番目のデータ３番目のデータ

　＜ＴＲ＞＜/ＴＲ＞の間に３つの＜ＴＤ＞＜/ＴＤ＞があるので３つのます目ができます。

　さらに２行３列の表を作るときには、この＜TR＞＜/ＴＲ＞のセットが２組必要で、その中に３つの＜ＴＤ＞＜/ＴＤ＞が入っていなければなりません。

<TABLE BORDER><TR><TD>１番目のデータ</TD><TD>２番目のデータ</TD><TD>３番目のデータ</TD></TR><TR><TD>４番目のデータ</TD><TD>５番目のデータ</TD><TD>６番目のデータ</TD></TR></TABLE>

１番目のデータ ２番目のデータ ３番目のデータ
４番目のデータ ５番目のデータ ６番目のデータ


　以降、横にます目を増やしたいときは＜ＴＤ＞＜/ＴＤ＞を増やしてください。縦にます目を増やしたいならば＜ＴＲ＞＜/ＴＲ＞とその中の＜ＴＤ＞をそれ以前の行と同じだけ作ってください。

　見出し部をつくりたいときは、見出し項目として＜ＴＤ＞＜/ＴＤ＞のかわりに＜ＴＨ＞＜/ＴＨ＞で置き換えてください。<TH></TH>の間の文字は見出しらしく太字、センタリングされます。
　＜TH＞は多分TABLE  HEADER、HEADWORD、HEADLINEのいずれかだと思います。つまり見出しを表します。

　この程度でＨＴＭＬの中で最も難しいのか、と思われる人もいると思います。たしかにそうでしょう。これくらいの小さく単純な表ならば他のタグとそうかわりはありません。
　ただし、レイアウトに工夫をすればするほどに複雑になっていきます。
　いずれご自身でおつくりになられたらわかるでしょう。

　複雑というのは

　

構　文

<HTML>
　<HEAD>
　　<TITLE>
　　</TITLE>
　</HEAD>
　<BODY>
<TABLE>
<TR>
<TH>１番目のデータ</TH><TD>２番目のデータ</TD><TD>３番目のデータ</TD>
</TR>
<TR>
<TH>４番目のデータ</TH><TD>５番目のデータ</TD><TD>６番目のデータ</TD>
</TR>
</TABLE>
　</BODY>
</HTML>　

　

　

使用例

<HTML>
<HEAD>
<TITLE>簡単な表</TITLE>
</HEAD>
<BODY>
<TABLE>
<TR>
<TH>事務担当者</TH><TD>山田太郎</TD><TD>鈴木雅夫</TD>
</TR>
<TR>
<TH>営業担当者</TH><TD>本田次郎</TD><TD>佐藤花子</TD>
</TR>
</TABLE>
</BODY>
 </HTML>

　


表示結果

事務担当者 山田太郎 鈴木雅夫
営業担当者 本田次郎 佐藤花子


　

　


一口メモ

　

　コンピュータの難しさは、操作ももちろんですが、意味や概念のわからない言葉が多いこともその大きな理由だと思います。特に日本人のように英語圏の人間でない者にとってはなおさらです。
　しかし、理解できた後に考えると、実際には、そうたいして難しいことではなかったということがたびたびあります。人を煙に巻くためにわざと難しく説明しているのではないかと疑ってみたくなります。
　よく、いろいろな場面で（相手の知識を探ってか、自分の立場を有利にするためか、その目的は図りかねますが）、意図的に英語や専門用語を多用する人をみかけます。
　そういう話し方をされると、既に知っていることでも、こちらの知識を試されているようで、あまりいい気持ちはしません。
　昔からいわれるように「本当に頭のいい人は難しいことを簡単に説明するが、頭の悪い人、人をはぐらかそうとする人は、簡単なことをさも難しそうにいう」といいます。
　その意味からしても、また、相手に不快感を与えるという意味からしても、先のような話し方をする人は、知識はあっても知恵のない凡人といえます。（たとえ自分達よりずっと豊富に知識をもっていたとしてもです）
　自分としても、この講座内では、できるだけだれにでもわかりやすい説明したいと考えています。
　ただ、だからといって、コンピュータ用語については無理に日本語や簡単な言葉におきかえてしまうと、かえって意味が伝わりにくくなる場合も多いので、実際には一般的に使われている用語、表現に落ち着いてしまいます。
　この講座内でも、意図せず、簡単なことを難しい表現で話していることがあるかもしれませんが、そのあたりはご了承ください。
　わかりにくい用語、表現があるようであればお申し出いただけば加筆いたします。

※　使用例をコピーして使いたいときは「講座の前に」をお読みください。