ホームページ作成・基礎講座・HTML・CSS・javascript・SEO対策

超初心者でも簡単にできるホームページ作成,HTML基礎講座 EasyStudyHTML

ホームページ作成 HTML基礎講座 inputタグ

ホームページ作成・HTML基礎・スタイルシート(CSS)・javascript・SEO対策



inputタグ:入力フォーム・チェックボックス・送信ボタン等を作成 clear.gif
【解説】複数項目を選択する場合に使用します。
入力フォーム・チェックボックス・送信ボタン・ラジオボタン等を作成
ボタンの作成
<input type="button" name"(1)" value="(2)">
(1)識別名(主にボタンを"script"で制御する場合に使用します)
(2)ボタンの表示文字
サンプルソース(ボタン)
<input type="button" name="sample_bu" value="クリック">
チェックボックスの作成(複数項目を選択する場合に使用します)携帯リストマーク
<input type="checkbox" name="(1)" value="(2)" (3)>
(1)識別名
※送信されるデータは"(1)=(2)"の状態で送信される。
(2)送信内容
(3)デフォルトのチェック項目
※(最初にcheckされた状態でページを開く項目に"checked"を追記する。
サンプルソース(チェックボックス)
<input type="checkbox" name="sample_bo1" value="40over" checked>体重40以上<br>
<input type="checkbox" name="sample_bo2" value="50over">体重50以上<br>
<input type="checkbox" name="sample_bo3" value="60over">体重60以上<br>
ラジオボタンの作成(複数項目から一つ選択する場合に使用します)携帯リストマーク
<input type="radio" name="(1)" value="(2)" (3)>
(1)識別名
※送信されるデータは"(1)=(2)"の状態で送信される。
(2)送信内容
(3)デフォルトのチェック項目
※(最初にcheckされた状態でページを開く項目に"checked"を追記する。
サンプルソース(ラジオボタン)
<input type="radio" name="sample_ra" value="40over" checked>体重40以上<br>
<input type="radio" name="sample_ra" value="50over">体重50以上<br>
<input type="radio" name="sample_ra" value="60over">体重60以上<br>
パスワード入力欄の作成携帯リストマーク
<input type="password" name="(1)" value="(2)" size="(3)" maxlength="(4)">
(1)識別名
※送信されるデータは"(1)=(2)"の状態で送信される。
(2)デフォルトの表示文字
※パスワード入力欄に最初から入力された状態の文字の指定。
※実際は"*"や"●"に置換されて表示されます。
(3)横幅枠(半角英数字の文字数)
(4)最大入力文字数(半角英数字の文字数)
サンプルソース(パスワード入力欄)
<input type="password" name="sample_pw" value="html" size="12" maxlength="10">
テキスト入力欄の作成携帯リストマーク
<input type="text" name="(1)" value="(2)" size="(3)" maxlength="(4)">
(1)識別名
※送信されるデータは"(1)=(2)"の状態で送信される。
(2)デフォルトの表示文字
※テキスト入力欄に最初から入力された状態の文字の指定。
(3)横幅枠(半角英数字の文字数)
(4)最大入力文字数(半角英数字の文字数)
サンプルソース(テキスト入力欄)
<input type="text" name="sample_te" value="html" size="12" maxlength="10">
ファイル選択ボタンの作成
<input type="file" name"(1)" value="(2)">
(1)識別名
※送信されるデータは"(1)=選択したファイルのパス名"の状態で送信される。
(2)デフォルトの表示文字
サンプルソース(ファイル選択ボタン)
<input type="file">
※(1)、(2)は無しでも可です。
pcリストマークサンプル表示

ページトップへ
TOP | 利用規約(免責) | お問合せ

Agora