超初心者にとって”何が解らないか解らない”

テーブルタグの活用
その他のオプションタグ


テーブルタグは単に表を作成するだけでなくブラウザーに表現したいオブジェクト
のレイアウト又背景色を利用してページの装飾などに多用されます。
これらを使用し表現のバリエーションを得る第一のメリットは画像を貼り付けるのとは
違い”テキスト”なのでファィル容量が少なく、ブラウザーへの表示速度がメチャ速い
と言う事です。
基本のタグmegane.gif

下が表の外枠

<TABLE>〜</TABLE>枠線無し
<TABLE BORDER="*">〜</TABLE>枠線有り

下が表の中に入れるタグ
<TD>〜</TD>テーブルデーター(列)
<TR>〜</TR>このタグで複数の<TD>〜</TD> を挟むと横一列が出来る

テーブルの位置指定
<TABLE ALIGN="*">〜</TABLE>ALIGN="*"*部分に left,center,rightを指定する。

テーブルデター内の位置指定
<TD ALIGN="*">〜</TD>ALIGN="*"*部分に left,center,rightを指定する。


(例)テーブル位置指定−左

<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="0" ALIGN="left">
<TR><TD>テーブル全体が左に</TD><TD>テーブル全体が左に</TD></TR>
<TR><TD>テーブル全体が左に</TD><TD>テーブル全体が左に</TD></TR>
</TABLE>
テーブル全体が左にテーブル全体が左に
テーブル全体が左にテーブル全体が左に




(例)テーブルデター内の位置指定

<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="0" ALIGN="center" WIDTH="400">
<TR><TD ALIGN="left"> データーが左に</TD><TD ALIGN="right"> データーが右に</TD></TR>
<TR><TD ALIGN="center">データーが中央に</TD><TD ALIGN="center">データーが中央に</TD></TR>
</TABLE>

データーが左にデーターが右に
データーが中央にデーターが中央に

複数行にまたがる列枠を作る

<TD ROWSPAN="*">〜</TD>"*"に行数分の数を入れる

サンプル

<TABLE BORDER="1" ALIGN="center">
<TR><TD ROWSPAN="4">サンプル</TD><TD>よ</TD></TR>
<TR><TD>う</TD></TR>
<TR><TD>こ</TD></TR>
<TR><TD>そ</TD></TR>
</TABLE>
サンプル

複数列にまたがる行枠を作る

<TABLE BORDER="1" ALIGN="center">
<TR><TD COLSPAN="4">サンプル</TD></TR>
<TR>
<TD>よ</TD><TD>う</TD><TD>こ</TD><TD>そ</TD>
</TR>
</TABLE>

サンプル

CELLSPACING="*"枠の太さ
CELLPADDING="*"枠線と表内データーとの位置
以上が大まかな基本タグでこれを利用しレイアウト
する。この方法だけでも結構そこそこのページが出来る

簡単な使用例 +1+

簡単な使用例 +2+



top-next.gif TOPPAGE html-5
ファイル名| WYSIWYG型エディター| NCコンポザーの使い方| WYSIWYG型以外のエディター| テーブルタグ| メタタグ|
プレタグ| スタイルシートの活用| JAVA(スクリプト)| ダイナミックHTML| その他の注意|
イメージマップ| ファィルのアップロード| それって何!?| ご意見ご質問| HOME|