HTMLリファレンスマニュアル

HTMLタグ完全一覧

HTML: <button>タグ

HTMLの<button>タグはクリック可能なボタンの要素を表し、フォームやドキュメントの他の簡単な標準ボタンが必要な場所に使用できます。このタグは通常<button>要素とも呼ばれます。

オンラインサンプル

以下のコードはボタンをマークしています：

サンプル

!DOCTYPE　html>
<html>
<head>　
<meta　charset="utf-8">　
<title>基本チュートリアル(oldtoolbag.com)</title>　
</head>　
<body>
<button　type="button"　onclick="alert('こんにちは、世界!') クリックして</button>
　
</body>
</html>

テストをしてみる‹/›

ブラウザの互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザが <button> タグをサポートしています。

タグの定義及び使用説明

button タグはボタンを定義する。

<button>要素内に、テキストや画像などの内容を配置できます。これは <input> 要素を使用して作成されたボタンとの違いです。

HTML <button>要素は<body>タグ内に位置しています。
<button>タグは<a>タグの後に配置できません。

ヒント：常に <button> 要素に type 属性を指定してください。異なるブラウザでは <button> 要素の type 属性に対するデフォルト値が異なります。

ヒントと注意

注記：HTML フォームで <button> 要素を使用すると、異なるブラウザでは異なるボタン値が送信されることがあります。以下を使用してください。 <input> HTML フォームでボタンを作成します。

HTML 4.01 HTML5の違い

HTML5 の中の新しい属性：autofocus、form、formaction、formenctype、formmethod、formnovalidate および formtarget。

属性

New　：HTML5 の中の新しい属性。

属性	値	説明
autofocusHTML5	autofocus	ページが読み込まれたときにボタンが自動的にフォーカスを取得するように指定します。
disabled	disabled	このボタンを無効にするべきです。
formHTML5	form_id	ボタンがどのフォームに属するかを指定します。
formactionHTML5	URL	フォームを送信するときにどこにフォームデータを送信するかを指定します。form 要素の action 属性を覆します。この属性は type="submit" と組み合わせて使用されます。
formenctypeHTML5	application/x-www-form-urlencoded multipart/form-data text/plain	フォームデータをサーバーに送信する前にどのようにエンコードするかを指定します。form 要素の enctype 属性を覆します。この属性は type="submit" と組み合わせて使用されます。
formmethodHTML5	get post	フォームデータを送信する際に使用する HTTP メソッドを指定します。form 要素の method 属性を覆します。この属性は type="submit" と組み合わせて使用されます。
formnovalidateHTML5	formnovalidate	この属性を使用すると、フォームを送信するときに確認を行いません。form 要素の novalidate 属性を覆します。この属性は type="submit" と組み合わせて使用されます。
formtargetHTML5	_blank _self _parent _top framename	action URL をどこで開くかを指定します。form 要素の target 属性を覆します。この属性は type="submit" と組み合わせて使用されます。フォームを送信した後に、応答を表示する場所を示す名前やキーワードを指定します。以下の値のいずれかです：_self、_blank、_parent、_top _self-現在のフレームやコンテキストにロードされたことを示します _blank-新しいウィンドウやコンテキストにロードされたことを示します _parent-親フレームやコンテキストにロードされたことを示します _top-完全なオリジナルウィンドウにロードされたことを示します
name	name	ボタンの名前を指定します。
type	submit　 reset button	ボタンのタイプを指定します。送信-ボタンがフォームデータをサーバーに送信する（タイプが指定されていない場合、デフォルト値）ことを示しますリセット-すべてのコントロールをリセットするボタンを示しますボタン-ボタンにデフォルトの動作がないことを示します
value	text	ボタンの初期値を指定します。スクリプトで変更できます。

グローバル属性

<button> タグがサポートする HTMLのグローバル属性。

イベント属性

<button> タグがサポートする HTMLのイベント属性。

HTML DOM リファレンスマニュアル：ボタンオブジェクト

HTML: <canvas>タグ HTML: <br>タグ