button要素 -- ボタン

基本データ

button要素
文書型 適用 子要素 開始タグ 終了タグ 分類
Strict ○ インライン要素 ブロックレベル要素(a要素 input要素 select要素 textarea要素 label要素 button要素 form要素 fieldset要素を除く) 必須 必須 インライン要素
Transitional ○ インライン要素 ブロックレベル要素(a要素 input要素 select要素 textarea要素 label要素 button要素 form要素 fieldset要素 isindex要素 iframe要素を除く)
Frameset ○

属性

固有属性

type="部品の種類"
Strict: ○ | Transitional: ○ | Frameset: ○
ボタンの種類を指定します。利用できる値は次のとおりです。
button
ボタン。
submit
送信ボタン。
reset
フォームの内容を初期化するボタン。
name="部品の名前"
Strict: ○ | Transitional: ○ | Frameset: ○
ボタンに名前をつけます。このname属性はa要素のname属性と違い、別のフォームにあるbutton要素であれば同じ名前をつけることができます。フォームを送信するときには、部品の名前と値がセットで送信されます。
value="初期値"
Strict: ○ | Transitional: ○ | Frameset: ○
初期値を設定します。ここで指定された値がボタンの表面のラベルになります。
tabindex="タブの順番"
Strict: ○ | Transitional: ○ | Frameset: ○
タブの移動する順番を指定します。指定できる値は0?32767です。ユーザーがTABを押すと、タブインデックスの小さい順にフォーカスが移動します。tabindex="0"を指定した要素やtabindex属性を持たない要素は、tabindex属性の値が最も大きい要素にフォーカスが移動した後、順番に選択されます。
accesskey="アクセスキー"
Strict: ○ | Transitional: ○ | Frameset: ○
アクセスキーを指定します。Windows用のInternet ExplorerならAltキーとアクセスキーの同時押しで、要素にアクセスします。どのような動作をするかはブラウザによって異なります。
disabled
Strict: ○ | Transitional: ○ | Frameset: ○
ボタンを利用できない状態にします。この属性が設定されたボタンは、データが送信されません。

解説

ボタンを作るための要素です。input要素でもボタンをつくることができますが、button要素の場合は中身がボタンのラベルになります。button要素の中身にはブロックレベル要素・インライン要素を含めることができるので、画像やテキストなど様々な要素をボタンの上に表示させることができます。

button要素でもinput要素と同じように、type属性でボタンの種類を指定できます。submitが送信ボタン、resetがリセットボタン、buttonが普通のボタンになります。

<p>
<button type="button">
<img src="btn.png" alt="画像ボタン">
</button>
</p>

Strict DTDの定義

<!ELEMENT BUTTON - -
     (%flow;)* -(A|%formctrl;|FORM|FIELDSET)
     -- push button -->
<!ATTLIST BUTTON
  %attrs;                              -- %coreattrs, %i18n, %events --
  name        CDATA          #IMPLIED
  value       CDATA          #IMPLIED  -- sent to server when submitted --
  type        (button|submit|reset) submit -- for use as form button --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  >

Information

現在の位置