送信・ﾘｾｯﾄボタン画像ボタン 汎用ボタン(１)汎用ボタン(２) フォーム ﾘﾌｧﾚﾝｽ へ
送信ボタンとリセットボタンを作る
フォーム設定のページ ◇フォームの設定、入力項目と項目名の関連付け、フォームのグループ化
◇テキスト入力、ラジオボタン、チェックボックス、セレクトボックスなど
◇送信ボタン、リセットボタン、画像の送信ボタン、汎用ボタンなど
<input type="submit"><input type="reset">
　「汎用ボタン(1)(2)」のページには、Java Script を使用しています。ブラウザ上部の情報バーに、
セキュリティの保護のため、コンピュータにアクセスできるアクティブ コンテンツは.....

を表示した場合は、こちらのページをご覧下さい。対処方法を掲載しています。
　<input>タグに type="submit" を指定すると送信ボタン、type="reset" を指定するとリセットボタンが作成できます。
　<input type="submit" value="送信する">
　<input type="reset" value="リセット">
type="" submit送信ボタンを作成
resetリセットボタンを作成
value="" ボタンに表示する文字を指定
name="" 送信ボタンを複数使用するときに指定
 ■value="" （ボタンに表示する文字）
　value="" で指定した文字をボタンに表示します。
　この指定を行わない場合は、ブラウザごとに次のようなデフォルトの文字を表示します。
デフォルト表示
　【送信ボタン】
　入力した内容を送信するためのボタンです。
　【リセットボタン】
　入力した内容をキャンセルして、初期状態に戻すためのボタンです。
　【送信ボタンが複数ある場合】
　押されたボタンにより処理を振分けるなど、複数の送信ボタンを必要とすることがあります。
　このような場合には、各送信ボタンに name="" を追加し、それぞれにボタン名を付けます。
ボタンのサイズや背景色などは、スタイルシートで設定できます。
　★ 使用例とブラウザでの表示
使　用　例   ブラウザの表示
☆ 標準（デフォルト）の表示
<form method="POST" action="samp_1.cgi">
<input type="text" name="b-name1"><br>
<input type="submit">
<input type="reset">
</form>

☆ value="" を指定する場合
<form method="POST" action="samp_1.cgi">
<input type="text" name="b-name2"><br>
<input type="submit" value="送信する">
<input type="reset" value="ﾘｾｯﾄする">
</form>

☆ 送信ボタンが複数ある場合
<form method="POST" action="samp_1.cgi">
<input type="text" name="b-name3"><br>
<input type="submit" value="送信１" name="sub1">
<input type="submit" value="送信２" name="sub2">
<br><input type="reset" value="ﾘｾｯﾄする">
</form>


関連するページ
CSS リファレンス フォーム(css)：フォーム リファレンス(css)へ
送信・ﾘｾｯﾄボタン画像ボタン 汎用ボタン(１)汎用ボタン(２) フォーム ﾘﾌｧﾚﾝｽ へ
画像で送信ボタンを作る
<input type="image">
　「汎用ボタン(1)(2)」のページには、Java Scriptを使用しています。ブラウザ上部の情報バーに、
セキュリティの保護のため、コンピュータにアクセスできるアクティブ コンテンツは.....

を表示した場合は、こちらのページをご覧下さい。対処方法を掲載しています。
　<input>タグに type="image" を指定すると、画像を使った送信ボタンを作成できます。
　<input type="image" src="send.gif" alt="送信">
　<input type="image" src="send.gif" alt="送信" align="right">
type=""image を指定
src=""読み込む画像のファイル名を指定
alt=""画像の代替えテキストを指定
align=""画像に並ぶ文字の位置を指定
name=""送信ボタンを複数使用するときに指定
　■src="" （画像のファイル名）
　ボタンに使用する画像のファイル名を指定します。
※ 画像ファイル名の指定は、「パス（URL）の指定方法」のページを参考にして下さい。パスの指定方法
　■alt="" （代替えテキスト）
　画像の代替えテキストを指定します。
　※ 詳細は、<img>タグの「画像の代替えテキストを指定する」をご覧下さい。
　■align="" （画像に並ぶ文字の位置）
　画像に並ぶ文字の位置を指定します。
　※ 詳細は、<img>タグの「画像に並ぶ文字」をご覧下さい。
align属性は、HTML4.01では非推奨とされています。詳細は、「非推奨タグと非推奨属性」のページをご覧下さい。非推奨タグのページへ
　【送信ボタンが複数ある場合】
　押されたボタンにより処理を振分けるなど、複数の送信ボタンを必要とすることがあります。
　このような場合には、各送信ボタンに name="" を追加し、それぞれにボタン名を付けます。
　【座標の送信】
　<form>タグに method="get" を設定し、画像を使った送信ボタンをクリックすると、クリックした位置（座標）が送信されます。
　■送信される形式
　例１ ボタン名を指定しない場合…index.html?x=20&y=15
　例２ ボタン名を指定した場合…index.html?ボタン名.x=20&ボタン名.y=15
右の画像ボタンをクリックすると、ブラウザのアドレスバー内の URL末尾に座標値を送信します。
表示する形式は、「例１」のタイプです。
　★ 使用例とブラウザでの表示
使　用　例   ブラウザの表示
☆ 送信ボタンが１個の場合
<form method="POST" action="samp_2.cgi">
<input type="text" name="i-name1"><br>
<input type="image" src="../acc/for/button.gif" alt="送信">

☆ 送信ボタンが複数ある場合
<input type="text" name="i-name2"><br>
<input type="image" src="../acc/for/buttonA.gif"
alt="送信ボタン１" name="buttonA">
<input type="image" src="../acc/for/buttonB.gif"
alt="送信ボタン２" name="buttonB"><br>
<input type="reset" value="ﾘｾｯﾄする">
</form>

関連するページ
HTML タグページ 代替えテキスト：画像の代替えテキストを指定する
HTML タグページ 画像に並ぶ文字：画像に並ぶ文字の位置を指定する
Utilety Page (参考)非推奨タグ：「非推奨タグと非推奨属性」へ
送信・ﾘｾｯﾄボタン画像ボタン 汎用ボタン(１)汎用ボタン(２) フォーム ﾘﾌｧﾚﾝｽ へ
汎用的なボタンを作る（１）
<input type="button">
　このページは、Java Script を使用しています。ブラウザ上部の情報バーに、
セキュリティの保護のため、コンピュータにアクセスできるアクティブ コンテンツは.....

を表示した場合は、こちらのページをご覧下さい。対処方法を掲載しています。
　<input>タグに type="button" を指定すると、汎用的に使えるボタンを作成できます。
　<input type="button" value="クリック">
　<input type="button" value="クリック" onclick="" name="">
type=""button を指定
value=""ボタンに表示する文字を指定
onclick=""ボタンをクリックした時の動作を指定
name=""ボタン名を指定する時に使用
　■value="" （ボタンに表示する文字）
　value="" で指定した文字をボタンに表示します。
　この指定を行わないと、次のような小さなボタンになります。　→ 
　この汎用タイプのボタンは、主にJavaScriptなどで使用します。
　name="" を追加すると、ボタン名を指定できます。
ボタンのサイズや背景色などは、スタイルシートで設定できます。
★ 使用例とブラウザでの表示
使　用　例   ブラウザの表示
☆ ボタンのクリックでアラートを表示
<input type="button" value="アラート"
onclick="alert('テスト表示です。')">
＊ ［アラート］ボタンを
クリックして下さい｡
※ この使用例は、JavaScriptを使用しています。
アラートを使用する場合は、<meta>タグで「スクリプト言語の指定」を行って下さい。
関連するページ
HTML タグページ ｽｸﾘﾌﾟﾄ言語：スクリプト言語を指定する
CSS リファレンス フォーム(css)：フォーム リファレンス(css)へ
送信・ﾘｾｯﾄボタン画像ボタン 汎用ボタン(１)汎用ボタン(２) フォーム ﾘﾌｧﾚﾝｽ へ
汎用的なボタンを作る（２）
<button type="">
　このページは、Java Script を使用しています。ブラウザ上部の情報バーに、
セキュリティの保護のため、コンピュータにアクセスできるアクティブ コンテンツは.....

を表示した場合は、こちらのページをご覧下さい。対処方法を掲載しています。
　<button>タグで、送信ボタンやリセットボタン、汎用ボタンなどを作成できます。
　<button type="button">表示する内容</button>
　<button type="submit" name="name" value="ボタン">表示する内容</button>
＊ <button>タグで囲んだ部分をボタンに表示します。表示内容にはタグも使用できるので､「文字
の装飾」や「画像の表示」もできます。
type=""button … 汎用ボタンを指定
submit … 送信ボタンを指定
reset … リセットボタンを指定
name=""ボタン名を指定（半角英数字）
value=""送信する内容を指定
ボタンのサイズや背景色などは、スタイルシートで設定できます。
　★ 使用例とブラウザでの表示
使　用　例   ブラウザの表示
☆ ボタンに表示する文字サイズを変更
<form method="POST" action="samp_3.cgi">
<input type="text" name="s-name1"><br>
<button type="submit"><big>送信</big></button>&nbsp;
<button type="reset"><small>リセット</small></button>
</form>

 
※ 使用例の &nbsp; は､ボタンの間隔を空けるための記述です。
☆ ボタンに画像を表示（JavaScriptの組み合わせ）
<button type="button" onClick="alert('テスト表示です。')">
<img src="../acc/for/btnAlert.gif" alt="アラートボタン"
height=40 width=45>アラート
</button>
＊ ［アラート］ボタンをクリックして下さい｡
※ この使用例は、JavaScriptを使用しています。
アラートを使用する場合は、<meta>タグで「スクリプト言語の指定」を行って下さい。
関連するページ
HTML タグページ ｽｸﾘﾌﾟﾄ言語：スクリプト言語を指定する
CSS リファレンス フォーム(css)：フォーム リファレンス(css)へ
送信・ﾘｾｯﾄボタン画像ボタン 汎用ボタン(１)汎用ボタン(２) フォーム ﾘﾌｧﾚﾝｽ へ