WEB技術の辞書・解説・使用例

TOP > HTML >  HTMLタグ辞典 >  <input>
<input>  フォーム  定番 

フォームの構成部品（入力欄・ボタン等）を作成。

入力フォームで用いる部品をtype属性の値により、テキストボックスやチェックボックスを作成します。<INPUT>タグ以外にも<SELECT> と <TEXTAREA>がフォームでは使用できます。

パラメーター


name="xxx" …名前を設定します。
　指定した名前は、送信先プログラムで値を取り出す際に必要となります。例えばPHPプログラムの場合は$_POST["xxx"]のようにして取得することができます。
value="xxx" …値を設定します。

送信先プログラムの例

<input type="text" name="user_name" value="guest" /> をPHPプログラムに送信した場合
プログラム側では $_REQUEST["user_name"] とすることで "guest" という値を取り出すことができます。

type="text" …1行テキストボックス

<input type="text" name="text1" />
<input type="text" name="text2" value="テキストボックスです" />

type="password" …パスワード入力ボックス

入力内容は *た●などに置き換えて表示されます。
<input type="password" name="password1" />
<input type="password" name="password2" value="pass" />

type="file" …ファイル送信

ファイル送信を行うための、ローカルファイルの選択機能。サーバー側にはファイルを受け取るためのプログラムが必要です。
<input type="file" name="file1" />

type="checkbox" …チェックボックス

チェックボックスをつくります。複数項目のチェックできます。
<input type="checkbox" name="check1" value="1">
<input type="checkbox" name="check1" value="2" checked="checked">

type="radio" …ラジオボタン

ラジオボタンをつくります。単一項目のみチェックができます。

<input type="radio" value="1" name="food" checked="checked">肉
<input type="radio" value="2" name="food">野菜
<input type="radio" value="3" name="food">穀物
<input type="radio" value="1" name="drink">ジュース
<input type="radio" value="2" name="drink" checked="checked">アルコール
肉 野菜 穀物 ジュース アルコール

type="hidden" …非表示フィールド

非表示データをサーバーに送信する際に使用します。
<input type="hidden" name="hidden1" value="見えますか？" />←は表示されません。
←は表示されません。

type="button" …汎用ボタン。

<input type="button" value="ボタンです" />

type="submit" …送信ボタン。

<input type="submit" />
<input type="submit" value="送信します" />

type="image" …送信ボタンを画像で表示。

<input type="image" src="/img/arrow2.gif" alt="送信" />

type="reset" …リセットボタン。

入力した内容を初期状態にします。
<input type="reset" />
<input type="reset" value="クリアします" />

HTMLの一般属性

属性説明
class="～"クラス名を指定。使用例
id="～"IDを指定します。使用例
style="～"スタイルシートを直接記述。使用例
title="～"タイトルを指定します。
dir="ltr|rtl"文字の表示方向を指定。 ltr(左から右)、rtl(右から左)
lang="～"言語を指定。日本語の場合は"ja"