テーブル（表）　表

楽天ブログ便利帳 - タグ帳 - テーブル（表）　表を作る

　【一つの枠】を増やす事で、【表】になります。
その「仕組み」と、「書き方」を説明します。
一見、複雑です。しかし、一つ一つ分解すると、非常に単純な構造です。

【一つの枠】

タグ
こう書くと

これが【一つの枠】のタグです。

<TABLE BORDER>
<TR>
<TD>一つの枠</TD>
</TR>
</TABLE>
　

こうなる

一つの枠

　これが基本です。
「【表】を作る」と言っても、【一つの枠】を増やすだけ。
構造は非常に単純です。

【表】　縦３行×横３列

タグ
こう書くと

　では、【一つの枠】が【表】になる様子を御覧下さい。

【一つの枠】
<TABLE BORDER>
<TR>
<TD>一つの枠</TD>
</TR>
</TABLE>

一つの枠

【表】　縦３行×横３列
<TABLE BORDER>
<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>

Ａ１	Ａ２	Ａ３
Ｂ１	Ｂ２	Ｂ３
Ｃ１	Ｃ２	Ｃ３

<TR></TR>と、
<TD></TD>が増えただけですね。
【枠】が増えると【表】になるのが分かりますね。
では次に、【表】の仕組み、【枠】の増やし方を説明します。

【行】と【列】

表は行列

【表】を分解すると、【行】と【列】で出来ています。

列

行

Ａ１	Ａ２	Ａ３
Ｂ１	Ｂ２	Ｂ３
Ｃ１	Ｃ２	Ｃ３

行列って？

縦（上下）の並び、【Ａ】、【Ｂ】、【Ｃ】を、『行』と言います。
横（左右）の並び、【１】、【２】、【３】を、『列』と言います。

次の様に覚えましょう。

<TR></TR>で【行】、【Ａ】、【Ｂ】、【Ｃ】を作り、
<TD></TD>で【列】、【１】、【２】、【３】を作ります。

行列を書く

　まず【Ａ行】を作り、
【１列】，【２列】，【３列】と、列を作る様子を御覧下さい。

<TABLE>　テーブル（表）の開始

　 <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>　テーブル（表）の終了

列

行

Ａ１	Ａ２	Ａ３
Ｂ１	Ｂ２	Ｂ３
Ｃ１	Ｃ２	Ｃ３

　つまり、
<TR></TR>で【下】に増えてゆきます。
<TD></TD>で【右】に増えてゆきます。
　

　タグを見て、表が目に浮かびますか？
次のタグではいかがでしょう。

列

行

Ａ１	Ａ２	Ａ３
Ｂ１	Ｂ２	Ｂ３
Ｃ１	Ｃ２	Ｃ３

　以上は、タグを見易く書いています。
『テーブル（表）基礎』　でも書きましたが、
『楽天ブログ』に書く際は、注意する点があります。

【楽天ブログ】で書く。
【フリーページ】、【トップ自由欄】に書く場合。
　【自動改行なし（<BR>タグで指定）】

特徴

　【自動改行なし（<BR>タグで指定）】の特徴は、
<BR>と書いた所だけ改行される事です。
言い方を変えると、<BR>と書いた部分でしか改行されません。
　

書き方

　
ああああああ<BR>
いいいいいい
<TABLE BORDER>
<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>
ううううううう<BR>
ええええええ<BR>
おおおおおお
　

利点

　この様に、見易く、整理しながら書けます。
【自動改行なし】を選ぶ最大の利点です。
『タグ帳』で紹介するタグも、コピペして、そのまま使えます。
　

補足

　『文章』と『テーブルタグ』について一言。

ああああああ<BR>
いいいいいいここ
<TABLE BORDER>
<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>ここ
ううううううう<BR>
ええええええ<BR>
おおおおおお

　
　『ここ』と書いてある部分は、
<BR>が無くても、自然と改行されます。
デザインの好みやバランスに合わせて書いて下さい。
　

　『メモ帳』などを使う事をお勧めします。
パソコン画面の左下に、『スタート』という所がありますね。
スタート→ すべてのプログラム→アクセサリ→メモ帳
と辿って行くと、『メモ帳』を開く事が出来ます。

　『メモ帳』でしたら、
タグが変な所で改行されていたら、すぐに分かります。
タグを見渡せるので、編集がとても楽です。

【フリーページ】、【トップ自由欄】に書く場合。
　【自動改行（初心者向け）】

特徴

　【自動改行（初心者向け）】　（<BR>を使わない）
で書く場合、少し注意が必要です。
<TABLE>から</TABLE>まで、
『改行』・『空白』を入れず、一気に書かないといけない、という点です。
そうしないと、テーブルのバランスが崩れてしまいます。
　

書き方

　
ああああああ
いいいいいい
<TABLE BORDER><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>
ううううううう
ええええええ
おおおおおお
　

利点

　この様に書きます。
・文章がメイン
・テーブルは一部だけ
という時には、文章のデザインがし易いので、
この【自動改行】が便利です。

　　欠点は、
「タグ</TD>を一つ消してしまった」
といった事が起きていても、気が付き難い点です。
「表がなんだかおかしい」
といったトラブルが起きた時に、どこが問題なのか探すのに苦労します。

トラブルの防止　＋　デザインし易く

　そこで、まず、
　

　
ああああああ<BR>
いいいいいい
<TABLE BORDER>

<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>
ううううううう<BR>
ええええええ<BR>
おおおおおお
　

　という様に、見易く書きます。
そして、後から

　と『改行』を消して、テーブルタグを一気に並べます。
複雑な表を作る場合でも、こうする事で、
表のイメージが湧き、デザインし易くなります。
　

【日記】に書く場合。

特徴

　【自動改行】についての指定はありません。
【自動改行（初心者向け）】の場合と同じ様に、
『改行』・『空白』を入れず、一列で書きます。
　

書き方

利点・補足

　注意点や、バランスを崩さないコツは、
【フリーページ】、【トップ自由欄】に書く場合。
【自動改行（初心者向け）】
を参照して下さい。
　

テーブル（表） 表

テーブル（表）　表