000000

HOME | DIARY | PROFILE

【フォローする】【ログイン】

ＧＴ－ＯＮＥ　楽天タグ講座　パイプ奮闘記

test

日記　GT-ONE　WEBSITE　【プチ講座】

【プチ講座】ヘルプ（ご質問掲示板）チャット

今日は【初心者のための日記でＴＡＢＬＥ講座！２】です！

前回はテーブルを使いまして、背景色を入れて見ました。

また、「ＴＡＢＬＥ」の中に「ＴＡＢＬＥ」も入れてみまして、便箋風な雛形も載せて見ましたね！

今回は、背景画像を入れてみましょう！

そして、「ＴＡＢＬＥ」の行と列を増やしてみます。

それを、大きな外側の「ＴＡＢＬＥ」の中に入れてみます。

■　日記に背景画像を入れてみよう！

まず背景色は↓これでしたよね！

<table width="100%" border="1" cellspacing="1" cellpadding="0" bordercolor="deeppink" bgcolor="#ffeeee"><tr><td bgcolor="#ffeeee">ここがセル内です</td></tr></table>

↑これに　

　この背景画像を入れて見ます。セルの中に

background="背景画像のＵＲＬ"

を追加します。

追加して見ました。↓

日記に壁紙が貼れました。「ここがセル内です」というところにテキストを書きます。

このように、日記を書いて行きます。
テキストは「ＥＮＴＥＲ」で改行します。
インデントしたい時は　 <UL>ここにテキスト</UL> 　を追加します。

<UL>

このように、行の頭をインデントして

そろえる事が出来ます。

また、センターリングしたい時は、

<CENTER>ここにテキスト</CENTER>

　と書きますと、

テキストも画像も

<CENTER>～から～</CENTER>

　ですべてがセンターリングします。

</UL>

<CENTER>
このようになります。
すべてのテキスト、画像がセンターリングします。

お判りでしょうか！(￣‥￣)=3 ﾌﾝ
</CENTER>

　 ■　テーブルの行と列を増やしてみよう！

【１列×１行】

ここがセル内です

<table width="150" border="1" cellspacing="0" cellpadding="0"><tr><td>ここがセル内です</td></tr></table>

【２列×１行】

ここがセル内です

セルを２列にしてみます。 <td>ここがセル内です</td> を追加します。
<table width="150" border="1" cellspacing="0" cellpadding="0"><tr> <td>ここがセル内です</td> <td>ここがセル内です</td> </tr></table>

【１列×２行】

ここがセル内です
ここがセル内です

セルを２行にしてみます。 <tr><td>ここがセル内です</td></tr> を追加します。
<table width="150" border="1" cellspacing="0" cellpadding="0"><tr><td>ここがセル内です</td></tr> <tr><td>ここがセル内です</td></tr> </table>

【２列×２行】

ここがセル内です	ここがセル内です
ここがセル内です	ここがセル内です

上の基本を元にして、２列×２行のテーブルを作ってみましょう。
<table width="150" border="1" cellspacing="0" cellpadding="0"><tr><td>ここがセル内です</td><td>ここがセル内です</td></tr><tr><td>ここがセル内です</td><td>ここがセル内です</td></tr></table>

どうでしょう！お判りになるでしょうか！

お願い・・わかって・・！(￣_￣ i)ﾀﾗｰ

この２列×２行のＴＡＢＬＥを使いまして、ちょっとしたアルバム風にする事が出来ます。

背景をつけた、ＴＡＢＬＥの中に、この２列×２行のＴＡＢＬＥを入れます。

では！やってみましょう。(￣‥￣)=3 ﾌﾝ

	ここに画像の説明を書きます。
	ここに画像の説明を書きます。

わかりやすいように、２列×２行のテーブルには枠を入れております。

枠をなくすには、border="1"　を　border="0"　にします。

タグを書いて見ます。

<table width="100%" border="1" cellspacing="1" cellpadding="0" bordercolor="deeppink" bgcolor="#ffeeee"><tr><td bgcolor="#ffeeee" background="http://plaza.rakuten.co.jp/img/user/65/14/1286514/57.gif ">

<table width="80%" border="1" bordercolor="deeppink" cellspacing="0" cellpadding="5" align="center"><tr><td><CENTER><IMG SRC="http://plaza.rakuten.co.jp/img/user/65/14/1286514/71.jpg"></CENTER></td><td>ここに画像の説明を書きます。</td></tr><tr><td><CENTER><IMG SRC="http://plaza.rakuten.co.jp/img/user/65/14/1286514/72.jpg"></CENTER></td><td>ここに画像の説明を書きます。</td></tr></table>

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