製作日：1999年４月25日
うーむ。スペインには残念ながら完敗でしたね。というか、スペインの体力、組織力は、伊達じゃなかったって事ですね。敗退したとはいえ、全日本もよく頑張りました（まさか決勝まで楽しめるとは夢にも思っていませんでしたからね）。
さてさて、本題にまいりましょう。ドラゴンクエストモンスターズにはまってしまい、更新が大幅におくれてしまいましたが、みんな見捨てずにおつきあい下さいね。前代未聞！究極！の役に立たないHTML書き方講座！第六回も懲りずにスタート！。今回は「テーブルについて」です。
答え：表です。
ごめん。前回と同じパターンのうえに、短すぎてわけわからんよね...
えーーっと。みなさん表って分かりますよね（^_^;）。
例えばこんな文↓があったとします。
全世界のシェア90％を占めるDOS/Vマシーンはバッチ処理に優れ、ビジネスシーンで多く使われています。一方、シェア10％のMacintoshは直感的な操作性で定評があり、印刷デザインや音楽などのクリエイティブ職に人気があります。
まぁ、わからなくは無いですけど...なんかパッとしませんよね。というか、こんな文読む気が失せちゃいますよね。そ、こ、で、（うふ）テーブル（表）の登場です（なんて強引な...）。
それでは『論より証拠』、さっそく表にしてみましょう。こんなやつ↓です。
| PCの種類 | DOS/Vマシン | Macintosh |
|---|---|---|
| シェア | 約90％ | 約10％ |
| 特徴 | バッチ処理・ビジネス向け | 使い勝手・クリエイティブ向け |
ね、見やすくなったでしょ。（なぜ太字？）
ビジュアルはホームページの華ですから、このテーブルにはさまざまな使い道があるのです。それでは、この大変便利なテーブルのタグを具体的に見ていきましょう。
使い勝手のあるテーブルですが、タグの書き方は実は非常にめんどくさいです。順番に少しづつ説明していきますので、ちょっと我慢しておつきあい下さいね。（変に愛想のいい編集長）
まず最初に書くのが<table>です。そして最後に</table>に付きます。これはお約束ですね。この間にテーブルの内容が入るわけです。『じゃあ、テーブルの中身はどうやるの？』というご質問には次の段落で解説いたします。
さて、いきなり？なタイトルですね。でも、これはちゃんと覚えておいて損はない情報なんです。表を書くときは横のラインで考えるのが基本です。何のことかって？表には縦軸（列）と横軸（行）がありますよね。今までの段落やリンクの説明では、『縦に何行？』なんて考えませんでしたね。つまり１行に入りきらない文字は自動的に改行されて次の行に移っていましたから、本文が何行になるか？ということは考えなくてよかったわけです。
ところが、です。表の場合は、縦に○列で横に○行というのを考えなければなりません。縦の事も考えないと表ではなく本文になってしまいます。ですから、HTMLでは、横軸（行）を組み合わせるように決められているのです。それでは、先の表を例に挙げながら説明してまいりましょう。
まずは一番最初の行です。
| PCの種類 | DOS/Vマシン | Macintosh |
|---|
今回は趣向を変えて、先にタグのソースを公開してから、その後で解説を入れてみます。
編集長の豆知識*** ソース ***
語源は英語のsource、もともとの意味は『源』『資料』などですが、コンピュータの世界では『プログラムなどの具体的な中身のこと』です。ここでは、タグの内容のことをソースと呼んでいます。ただ単にタグと呼んでも意味は通じますが、『このホームページのソースは美しくまとまってるよね』なんて訳も分からずちょっと通ぶって会話してみましょう。周りが「おー！！」と感心してくれます。（たとえ感心してくれなくても、編集長に文句を言わないでね）
えーーと。話を元に戻して...
いきなりですが、あと覚えなければならないタグは<tr>と<td>です。<tr>は『横一行がここから始まるよ』という意味のタグです。それに対して、<td>のタグは、一つのセル（１マスのこと）を表します。主にこれら３つのタグをワンセットにして表は成り立っているのです。ね、めんどくさいでしょ。ここでこの表の一行目のタグを見てみましょう。
<table>
<tr>
<td>PCの種類</td>
<td>DOS/Vマシン</td>
<td>Macintosh</td>
</tr>
</table>
どうです？分かりましたか？（それで分かれば苦労しないって...）
蛇足ながら説明いたしますと、最初の<table>タグで、「ここからテーブルが始まるよー」と宣言しています。次に２行目の<tr>タグで、「ここからテーブルの一行目が始まるよー」と宣言しています。そして３行目の<td>タグで、「ここからこの行のセルが始まるよー」と宣言しているわけです。（HTMLも当然ながら欧米生まれですから、欧米言語と同じように左から埋めていきます。つまり、『PCの種類』のセルが一番左ですから、このセルから順に右のセルへと書いていくわけです。）タグの次にはその中身、というお約束ですから、PCの種類と書き込み、そしてこのマスは終わりですので、「このセルはもう終わりだよ」という意味で、</td>タグを書き、３行目は終わりです。
ここまで分かれば後は機械的な作業のみです。４行目と５行目は、それぞれ、真ん中のセルと右のセルについて書いています。そして、６行目でその行がすべて完了したことを表し、最後の行がテーブル自体が完了することを意味しています。
一行モノの表がわかれば、それが複数行になっても恐いモノはありません。先ほど<td>と</td>のタグを繰り返したのと同じように、<tr>と</tr>のタグを繰り返せば、繰り返した数だけ横の行数が増えていきます。ちなみに最初の表（３×３行の表）のソースリストは以下のようになります。
<table>
<tr>
<td>PCの種類</td>
<td>DOS/Vマシン</td>
<td>Macintosh</td>
</tr>
<tr>
<td>シェア</td>
<td>約90％</td>
<td>約10％</td>
</tr>
<tr>
<td>特徴</td>
<td>バッチ処理・ビジネス向け</td>
<td>使い勝手・クリエイティブ向け</td>
</tr>
</table>
ひょっとしたらここで、「あれ？表の枠線の事は何も書かないの？」と思ったあなた！いいセンスしています。そうです、ここに挙げたソースでは見た目の指定を何もしていませんね。（セルの大きさとか、枠線の太さとか）。ここでは何も指定していませんので、ブラウザくんが勝手に『こんなモンだろう』と判断して表を書いていますが、もちろん我々が『こうしなさい』といちいち指定することも出来ます。そして、これらを指定することによって、単なる表だけではなく、万能のレイアウトツールとしても使えるようになるのです！！その表の持つ魔力についてこれから...
あれ、天の声が聞こえる......（おいおい！） ....また次回！！４６４９！（よろしくらしい）
あひるたん♪への励まし、愛情、記事のメールは こちら へどうぞ。