この記事はHTML 4/XHTML 1での<button>要素についての解説記事です。
HTML 5での<button>要素に関する解説記事は、HTML 5 リファレンス内のHTML 5での<button>要素をご覧ください。
ボタンとなる<button>要素についての解説です。
<button>要素とは、ボタンです。
<button>要素は<input>要素と異なり、マークアップされた文字列やオブジェクトなどをボタンとする事が出来ます。
<button>要素は通常<form>要素の内容に使われますが、必ずしも<form>要素の内容にしなければいけない訳ではありません。
<button>要素は、以下の文書型で利用出来ます。
ネットスケープ 4.x以前などの旧型ユーザエージェントでは、利用出来ない場合があります。
<button>要素はフォームモジュールに属します。
<button>要素はインライン要素です。
<button>要素の内容はボタンに使われる要素、インライン要素だけでなくブロックレヴェル要素が使えます。
但し、<button>要素の内容には
は入れられません。
<button>要素の内容は画像や強調などのマークアップが使えます。
<button>要素には、以下の属性が定められております。
ボタンのタイプを指定します。
当該入力欄を無効にします。
disabeld="disabeld"属性とします。当該入力欄が閲覧者操作で選択された場合に起動するクライアントサイドスクリプトを記述します。
当該入力欄の値が閲覧者操作で変更された場合に起動するクライアントサイドスクリプトを記述します。
<input>要素で使える共通属性には
があります。
… <button type="submit" name="mode" value="GO"><img alt="GO!" src="go.GIF" width="64" height="32" /></button> …
上記の例では「go.GIF」と言う画像を送信ボタンにしており、このボタンが押された際にはクエリ名「mode」、クエリ値「GO」が併せて送信されます。
これを<input>要素で行うと以下のようになります。
… <input type="image" name="mode" value="GO" alt="GO!" src="go.GIF" /> …
… <button type="reset" name="mode" value="GO"><img alt="GO!" src="go.GIF" width="64" height="32" /></button> …
type="submit"属性以外が附与されている場合は<input>要素で置き換えられません。