HOME > オンラインマニュアル > ホームページ作成ガイド > HTML編 > テーブル・フレーム・フォーム

ホームページ作成ガイド



HTML編

テーブル・フレーム・フォーム

1. テーブル
 

表を作成します。

 

<table>…表の作成[★★★]
 width="px/%"…テーブルの横幅
 height="px/%"…テーブルの縦幅
 border="px"…傍線の太さ
 cellpadding="px"…罫線とセル内との間隔
 cellspacing="px"…セル間の間隔
 frame="VOID/ABOVE/BELOW/HSIDES/VSIDES/LHS/RHS/BOX/BORDER"…外枠線の表示方法
 rules="NONE/GROUPS/ROWS/COLS/ALL"…罫線の表示方法
 summary="文字列"…テーブルの概要
 align="LEFT/CENTER/RIGHT"…表示位置指定
 bgcolor="#RRGGBB"…背景色
 background="ファイル名"…壁紙

<tr>…列の作成[★★★]
 align="LEFT/CENTER/RIGHT/JUSTIFY/CHAR"…列単位でのセル内の横の表示位置
 valign="TOP/MIDDLE/BOTTOM/BASELINE"列単位でのセル内の縦の表示位置
 char="文字"…align属性の基準となる文字
 charoff="px/%"…表示位置揃え時のオフセット
 bgcolor="#RRGGBB"…背景色
 background="ファイル名"…壁紙

<td>…セルの作成[★★★]
<th>…ヘッダセルの作成[★★★]
 align="LEFT/CENTER/RIGHT/JUSTIFY/CHAR"…セル内での横の表示位置
 valign="TOP/MIDDLE/BOTTOM/BASELINE"…セル内での縦の表示位置
 rowspan="値"…横にまたがるセルの数
 colspan="値"…縦にまたがるセルの数
 char="文字"…align属性の基準となる文字
 charoff="px/%"…表示位置揃え時のオフセット
 heads="文字列"…関連するヘッダのID
 scoope="ROW/COL/ROWGROUP/COPGROUP"…ヘッダ情報を提供するセル
 abbr="文字列"…内容の省略形
 bgcolor="#RRGGBB"…背景色
 background="ファイル名"…壁紙
 width="px/%"…セルの横幅
 height="px/%"
 nowrap…改行の禁止

<caption>…表にキャプションをつけます。[★★]
 align="TOP/BOTTOM/LEFT/RIGHT"…キャプションの位置

<colgroup>…表の縦のグループを指定します。[]

<col>…表の縦列を指定します。[]
 span="値"…まとめるセルの数
 align="LEFT/CENTER/RIGHT/JUSTIFY/CHAR"…セル内での横の表示位置
 valign="TOP/MIDDLE/BOTTOM/BASELINE"…セル内での縦の表示位置
 width="px/%"…セルの横幅
 char="文字"…align属性の基準となる文字
 charoff="表示位置揃え時のオフセット
 heads="文字列"…関連するヘッダのID

<thead>…テーブルのヘッダ[]
<tbody>…テーブルの本体[]
<tfoot>…テーブルのフッタ[]
 align="LEFT/CENTER/RIGHT/JUSTYIFY/CHAR"…セル内での横の位置指定
 valign="TOP/MIDDLE/BOTTOM/BASELINE"…セル内での縦の位置指定
 char="文字"…align属性の基準となる文字
 charoff="表示位置揃え時のオフセット


2. フレーム
 
ウィンドウを分割してそれぞれに別のHTMLファイルを表示します。


<frameset>…フレーム分割の定義[★★]
 cols="px/%,*"…縦にフレームを分割するときのサイズ指定
 rows="px/%,*"…横にフレームを分割するときのサイズ指定

<frame>…フレームの定義[★★]
 src="URI"…フレームに表示するURI
 name="文字列"…フレームの名前
 frameborder="1/0"…フレーム枠の表示
 marginwidth="px"…フレーム枠と内容との横余白
 marginheight="px"…フレーム枠と内容との縦余白
 scrolling="YES/NO/AUTO"…フレームのスクロール
 noresize…サイズ変更禁止
 longdesc="URI"…詳細の記述があるURI

<iframe>…インラインフレームの定義[]
 src="URI"…インラインフレームに表示するURI
 frameborder="1/0"…フレーム枠の表示
 marginwidh="px"…フレーム枠と内容との横余白
 marginheight="px"…フレーム枠と内容との縦余白
 scroing… ”YES/NO/AUTO"…スクロール
 longdesc="URI"…詳細な記述があるURI
 width="px/%"…横幅指定
 height="px/%"…縦幅指定
 name="文字列"…インラインフレームの名前
 align="TOP/MIDDLE/BOTTOM/LEFT/RIGHT"…横に並ぶテキストの表示位置指定

<noframes>…フレームの代替[★★]

 

 

3. フォーム

ユーザからの入力を得ます。

 

<form>…フォームを定義します。[★★★]
 action="URI"…実行するプログラムのURI
 method="GET/POST"…データの渡し方
 enctype="MIMEタイプ"…サーバーに渡すデータのMIMEタイプ
 accept-charset="文字コード"…扱う文字コード
 target="フレーム名"…ターゲットのフレーム名

<fieldset>…フォームのグループ[★★]

<legend>…フィールドの表題[★★]
 accesskey="キャラクター"…アクセスのためのキーとなる文字
 align="TOP/BOTTOM/LEFT/RIGHT"…表示位置指定

<label>…テキスト入力フィールドのラベル[★★]
 for="文字列"…対応する入力コントロールのID
 accesskey="キャラクター"…アクセスのためのキーとなる文字

<input>…フォームの入力用コントロール[★★★]
 type="TEXT/PASSWORD/CHECKBOX/RADIO/SUBMIT/RESET/FILE/HIDDEN/IMAGE/BUTTON"…入力コントロールの種類
 value="文字列"…初期値
 name="文字列"…名称
 checked…チェック済み
 disabled…入力コントロールの無効化
 readonly…読み込み専用
 size="値"…入力ボックスの文字数
 maxlengs="値"…最大入力文字数
 src="URI"…type属性の貼り込む画像のURI
 usemap="URI"…クライアントサイドイメージマップの情報のURI
 accept="MIMEタイプ"…ユーザが入力すべきMIMEタイプ
 accesskey="キャラクター"…アクセスのためのキーとなる文字
 tabindex="0-32767"…TABキーによる操作のための順番

<button>…ボタン[★★★]
 type="BUTTON/SBMIT/RESET"…ボタンのタイプ
 value="文字列"…初期値
 name="文字列"…名称
 disabled…ボタンの無効化
 accesskey="キャラクター"…アクセスのためのキーとなる文字
 tabindex="0-32767"…TABキーによる操作のための順番

<select>…セレクター[★★★]
 name="文字列"…名称
 size="値"…セレクターのサイズ
 multiple…複数選択可能にする
 disabled…ボタンの無効化
 tabindex="0-32767"…TABキーによる操作のための順番

<option>
…選択肢[★★★]
 label="文字列"…ラベルを指定
 value="文字列"…選択肢の値
 disabled…ボタンの無効化
 selected…選択済み

<optgroup>…オプションのグループ[★★]
 label="文字列"…ラベルの指定
 disabled…ボタンの無効化

<textarea>…テキスト入力フィールド[★★★]
 rows="値"…行数
 cols="値"…文字数



お問合せ

お問合せフォーム (365日24時間受付)

フリーダイヤル:0120-40-2610
(平日9:00~18:00)

サービスの特長

お申込み

ドメインチェック

重要なお知らせ

ご契約のお客さま

旧サービスご利用のお客さま

パートナー制度