Home
HTML&CSS Web制作のインデックス
-各種リファレンスとサンプルコード集-

<< Home / ケータイ index / テーブルタグ / 表を作る
Mobile Index

<TABLE><TR><TD>
表を作る


対応機種

表を作るときには、TABLEタグTRタグTDタグを組み合わせて使います。


テーブルタグの基本的な構成は次のようになります。

<TABLE>
<TR>
<TD>この部分が表の中に表示されます</TD>
</TR>
</TABLE>


<TABLE> 〜 </TABLE> テーブル全体を作るタグ
<TR> 〜 </TR> 行を作るタグ
<TD> 〜 </TD> 行の中にセルを作るタグ



■TABLEタグ <TABLE></TABLE>

ひとつの表に対して、このTABLEタグが1セット必要になります。


■TRタグ <TR></TR>

TRタグは行を指定するタグです。1行ごとにこのTRタグが1セット必要になるので、例えば5行の表を作る場合は5セットのTRタグが必要になります。


■TDタグ <TD></TD>

TDタグはセルを指定するタグで、TRタグに囲まれた範囲内で使います。例えば5セットのTDタグを並べると、1行の中にセルが5列並ぶことになります。


表作りの基本形は、以上の3種類のタグで構成されます。

※分かりやすくするために、以下のサンプルでは TABLEタグBORDER を付けた状態で説明していきます。
 (BORDER を付けないと、表の枠部分の線が表示されません。詳しくはTABLE BORDERの項目をご覧ください。)

【使用例】

■1行の中に2列のセルを作ってみます

<TABLE BORDER>
<TR>
<TD>セル1</TD>
<TD>セル2</TD>
</TR>
</TABLE>

サンプル画面
セル1 セル2

【使用例】

■2列のセルを3行作ってみます

<TABLE BORDER>
<TR>
<TD>セル1</TD>
<TD>セル2</TD>
</TR>
<TR>
<TD>セル3</TD>
<TD>セル4</TD>
</TR>
<TR>
<TD>セル5</TD>
<TD>セル6</TD>
</TR>
</TABLE>

サンプル画面
セル1 セル2
セル3 セル4
セル5 セル6

【使用例】

■2列のセルを3行作ってみます(BORDERを指定しない例)

<TABLE>
<TR>
<TD>セル1</TD>
<TD>セル2</TD>
</TR>
<TR>
<TD>セル3</TD>
<TD>セル4</TD>
</TR>
<TR>
<TD>セル5</TD>
<TD>セル6</TD>
</TR>
</TABLE>

サンプル画面
セル1 セル2
セル3 セル4
セル5 セル6

使用例のサンプル画面は、携帯電話での表示を想定したおおまかなイメージです。実際とは多少異なる場合があります。

<< 前のページにもどる


<< Home / ケータイ index / テーブルタグ / 表を作る Page Top