<INPUT>･････フォームの構成部品（入力欄・ボタン等）を作成する

type="text"

1行テキストボックスをつくります。通常のテキストを入力するフィールドです。2行以上にわたる長い文章を入力させたい場合には、<TEXTAREA>〜</TEXTAREA>を使用します。

type="password"

パスワード入力ボックスをつくります。入力したテキストがアスタリスク（*）などに置き換えて表示されます。ただし、データが暗号化されるわけではないので、送信されたデータを受け取ることができれば内容を見ることができます。利用の際には注意してください。

type="checkbox"

チェックボックスをつくります。チェックボックスは複数選択が可能です。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります。

type="radio"

ラジオボタンをつくります。複数の中から一つしか選択できない点がチェックボックスと異なります。複数を一つのグループとして認識させるには、name属性で同じ名前を付けてください。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります。

type="file"

サーバーへファイルを送信する際に、送信するファイルを選択します。ファイル名の入力フィールドと[参照]ボタンが表示されます。サーバー側にはファイルを受け取るための特別なCGI等が必要です。

type="hidden"

隠しデータをサーバーに送信する際に使用します。このタイプのデータは、画面上には表示されませんが、value属性で指定した値がサーバーへ送信されます。

type="submit"

送信ボタンをつくります。

type="reset"

リセットボタンをつくります。このボタンを押すと、それまでに入力した情報をキャンセルして初期状態に戻します。

type="button"

汎用ボタンをつくります。

type="image"

画像のボタンをつくります。使用する画像ファイルはsrc属性で指定してください。またalt属性が必須となります。

HTMLソース

<form action="cgi-bin/aaa.cgi" method="post">
<table border="0">
  <tr>
    <td align="right"><b> 名前：</b></td>
    <td><input type="text" name="name" size="30" maxlength="20"></td>
  </tr>
  <tr>
    <td align="right"><b> パスワード：</b></td>
    <td><input type="password" name="pass" size="6" maxlength="4"></td>
  </tr>
  <tr>
    <td align="right"><b>学年：</b></td>
    <td>
      <input type="radio" name="gakunen" value="１年生">１年生
      <input type="radio" name="gakunen" value="２年生">２年生
      <input type="radio" name="gakunen" value="３年生">３年生
      <input type="radio" name="gakunen" value="４年生">４年生
      <input type="radio" name="gakunen" value="５年生">５年生
      <input type="radio" name="gakunen" value="６年生">６年生
    </td>
  </tr>
  <tr>
    <td align="right"><b>好きな課目：</b></td>
    <td>
      <input type="checkbox" name="kamoku" value="国語">国語
      <input type="checkbox" name="kamoku" value="英語">英語
      <input type="checkbox" name="kamoku" value="算数">算数
      <input type="checkbox" name="kamoku" value="理科">理科
      <input type="checkbox" name="kamoku" value="社会">社会
      <input type="checkbox" name="kamoku" value="体育">体育
    </td>
  </tr>
  <tr>
    <td align="right"><b>宿題ファイル：</b></td>
    <td><input type="file" name="syukudai"></td>
  </tr>
  <tr>
    <td></td>
    <td>
      <input type="submit" value="送信">
      <input type="reset" value="リセット">
    </td>
  </tr>
</table>
</form>

↓↓↓

ブラウザ上の表示

名前：
パスワード：
学年：	１年生 ２年生 ３年生 ４年生 ５年生 ６年生
好きな課目：	国語 英語 算数 理科 社会 体育
宿題ファイル：