テーブル

<TABLE> <TABLE BORDER> TD TH

<TABLE>(罫線なし)、<TABLE BORDER>(罫線あり)〜</TABLE>(どちらも共通)で囲んで、TD(強調はTH)でセルの中身を書きます。セルは横に伸びていくので、次の行にいくために、TDをTRで囲みます。

横に 伸びます
次の 行です 
<TABLE BORDER>
<TR> <TD>横に <TD>伸びます </TR>
<TR> <TD>次の <TD>行です </TR>
</TABLE>

TD,TRとも終了タグは省略できますが、NNではうまく表示されないことがあるらしいです。

BORDER=""

<TABLE BORDER="数字"> で、枠線の太さを指定します

SUMMARY=""

音声出力用のために、記入することがすすめられてます。
<TABLE summary="fish">

CAPTION

CAPTIONで表題をつけることができます。TABLEの後に入れます

<TABLE BORDER="2" SUMMARY="初心者のサンプル">
<CAPTION>サンプル</CAPTION>

WIDTH="" HEIGHT=""

TABLEの幅、高さを指定します。ピクセルか%で。

FRAME="" RULES=""

FRAMEは、表の外枠の形の指定、RULESは、表内の枠です。
FRAME=void(既定),abode,below,hsides,vsides,lhs,rhs,box,border
RULES=none,groups,rows,cols,all
いろいろ試してみてください。groupsは、グループ化(TBODY…)のみ囲みます。説明はここではしません。
<TABLE BORDER>というのは、FRAME="BORDER"ということです。

CELLPADDING CELLSPACING

CELLPADDINGは、セル内の余白です。CELLSPACINGは、枠の太さです。

COLSPAN ROWSPAN

COLSPANで、行(横)のセルを結合号します。 ROWSPANで、列(縦)のセルを結合します。

横に合体
左下 右下 
<TABLE BORDER CELLPADDING="10" CELLSPACING="6">
<TR> <TD COLSPAN=2>横に合体</TD> </TR>
<TR> <TD>左下</TD> <TD>右下</TD> </TR>
</TABLE>

ALIGN VALIGN

ALIGNは、横位置の設定、VALIGNは、縦位置の設定です。
ALIGN="" left,right,center,justify(均等),char(ピリオド等で揃える)
VALIGN="" top,bottom,middle,baseline

色

いろいろ工夫してみてください

COLORカラフル
<TABLE BORDER STYLE="COLOR:white; border:outset lime 4px; background-color:red;">
<TR STYLE="background-color:maroon;"><TD>COLOR</TD><TD style="border:blue 4px solid;">カラフル</TD></TR>
</TABLE> 
Next : 次のステップへ
Pre  : 前のステップへ
 Up  : HTMLに戻る
Home : ホームに戻る
Presented by Rei

楽天モバイル[UNLIMITが今なら1円] ECナビでポインと Yahoo 楽天 LINEがデータ消費ゼロで月額500円〜！


無料ホームページ 無料のクレジットカード 海外格安航空券 解約手数料０円【あしたでんき】 海外旅行保険が無料！ 海外ホテル