button要素

TOPページに戻る > html入門

button要素

フォームに送信ボタンを付ける要素です
input要素の属性で作る送信ボタンとは違い、内容にブロック要素、インライン要素を表示できます
画像も使うことができるので装飾を凝らした複雑なボタンも作ることができます

使い方（書式）

<button></button>

button要素

対応ブラウザ
要素の種類	インライン要素
内容となる要素	ブロック要素、インライン要素（a要素やフォームの部品は内容にできません）、テキスト

属性	説明
type属性	ボタンの種類を指定します。type属性の指定がない場合の初期値は submitです 値には、submit（送信ボタン）、button（通常のボタン）、reset（リセットボタン）
name属性	送信ボタンをクリックしたときにサーバーに送信される項目の名前をサーバーに送信できます
value属性	送信ボタンをクリックしたときにサーバーに送信される項目の値です
disabled属性	フォームの入力項目と選択を禁止して操作できなくします この属性が付いている項目はサーバーに値を送信しません
共通属性	html共通属性
イベント属性	htmlイベント属性

実際の指定方法

html

<form action="mail.cgi" method="post">
<table cellpadding="5">
 <tr>
 <td>※メッセージ</td>
 <td>
   <textarea name="f5" cols="50" rows="6"></textarea>
 </td>
 </tr>
 <tr>
 <td colspan="2">
 <button type="submit" name="項目名" value="項目名の値">送信ボタン</button>
 <input type="reset" value="リセット"> 
 </td>
 </tr>
</table>
</form>

実際の表示

※サンプルのためフォームのみでcgiは動きません

※メッセージ
送信ボタン

その他のデザインはcssでスタイルを指定