ひなこの楽天web制作研究所

や！　久しぶりです。

掲示板その他にあまりレスできなくてすみませんでした。

で、テーブルについてです。さっそくです。

htmlでテーブル（表のこと）てのは、すごい、もうよく使います。楽天の日記の中では使えないっぽいですが、トップページとか、あとサイドのページでは使えると思います。

これは、表を作るだけではなくて、画面をレイアウトしたり配置するのに使えます。とてもおくが深いです。ええ。なので、ゆっくりちょっとずつ解説しますね。

---

まず、テーブルってことで

<table>

</table>

と書きます。
<table>こちらが開始タグ。
</table>こちらが終了タグです。

当然ですが、すべて半角英数字で。スペルミスのないように注意してくださいね！！

で、テーブルの中に行と列があります。

とりあえず、３行２列のテーブルにしてみましょう。
行は
<tr> こちらが開始タグ。
</tr>こちらが終了タグ。

これをさっきのテーブルの内側に書きます。

<table>
<tr>
</tr>
</table>

で、列はですね。
<td> こちらが開始タグ。
</td>こちらが終了タグ。

これを、行の内側に書きます。

<table>
<tr>
<td>
</td>
</tr>
</table>

これで、一行、一列です。

で、二列にするには。
<td>
</td>
これをもう一個後ろに追加します。

<table>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>

こうです。三列以上にしたい場合も同じように後ろに追加してください。

復習です＞行(tr)の中に、列(td)を書きます。

で、もともと３行２列のテーブルにするといいました。この行の部分を全部コピーしてもう一個後ろに追加します。つまり。

<tr>
<td>
</td>
<td>
</td>
</tr>
ここ、をコピーして。この後ろにペースト。

<table>
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>

こうです。３行にするので、もういっちょコピー！

<table>
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>

これで３行２列のテーブルができました。

これで表が表示されます…。がひとつ注意。

テーブルの中に文字を書き込みたいときには！
<td>
このあいだに書きます。
</td>

で、じつは　tdの中身に何も書いていないと、表がきちんと表示されません。


<table>
<tr>
<td>なまえ
</td>
<td>ひなこ
</td>
</tr>
<tr>
<td>せいべつ
</td>
<td>おんなのこ
</td>
</tr>
<tr>
<td>しゅみ
</td>
<td>どくしょ
</td>
</tr>
</table>

のように、中身を書いてみます。

今日はここまで～～。

どう？やってみて～。

こんな風になったかな？
http://plaza.rakuten.co.jp/hina2/3001

このままだともちろん話にならないので、あしたからちょっとずついじっていきます。