button - ボタン

ボタンを作成します。
type属性に(submit,reset,button)をそれぞれ指定することができます。(初期値はsubmit)

button要素のブラウザ別サポート状況

- ie6 ie7 ie8 ie9 firefox4 chorme safari5 opera10
button

button要素のHTML4からHTML5への変更点

HTML5では、新たにautofocus属性・form属性・formaction属性・formenctype属性・formmethod属性・formnovalidate属性・formtarget属性 が追加されました。

コンテンツ属性

グローバル属性 すべての要素で共通に使える属性。HTML5で新たに定義された属性もあります。
name フォーム・コントロールの名前
value 値を指定
type ボタンの挙動をコントロール
・submit - フォームをサブミット(初期値)
・reset - フォームをリセット
・button - 何もしない
disabled 操作無効
autofocus 自動フォーカス
初期画面でフォーカスさせるものに1つ指定可
form フォームと関連付けるid名を指定
formaction 送信先URLを指定
formenctype 送信するデータの形式を指定
・application/x-www-form-urlencoded - URLエンコードして送信(デフォルト)
・multipart/form-data - マルチパートデータとして送信
・text/plain
formmethod 送信方法を指定
・get
・post
formnovalidate 入力データの妥当性を確認しない
formtarget 送信するターゲット先を指定
・_blank - 名前のない新しいウインドウに表示
・_self - 現在のウインドウに表示
・_parent - フレーム内からのリンクの場合、フレーム設定文書(多くの場合、フレームを解除しウインドウ全体)に表示
・_top - フレーム内からのリンクの場合、フレームを解除し最上位ウインドウ全体に表示
・任意の名前 - リンク先を指定の名称を持つ新しいウィンドウひ表示

「基本」のサンプル

HTMLコード

<form action="request.php" method="get">
<input type="text" name="example" value="テスト"><br>
<button type="submit">送信</button>
<button type="reset">リセット</button>
</form>

プレビュー

対応していないブラウザでは正しくプレビューされません。

別ウィンドウで「基本」のサンプルプレビューを確認

原文(英語):(http://www.w3.org/TR/2010/WD-html5-20100624/the-button-element.html#the-button-element)