中年おっちゃんでも出来たウェブページ作成講座 with ? mark

push BUTTON

BUTTON要素は、フォームコントロール部品要素で、押しボタンを作成します。

要素の内容は０個以上の
A , INPUT , SELECT , TEXTAREA , LABEL , BUTTON , FORM , FIELDSET
を除く要素で、ボタンの名前に反映されますが、
<button></button>
では意味がありません。１個以上の要素が必要です。
FORM要素外でも使用できます。
disabled属性を指定した場合を除き、tabindex属性 accesskey属性を省略不可とします。

W3C → XHTML 1.0 → Multi-part XHTML file → DTDs → XHTML-1.0-Strict より

<!-- button uses %Flow; but excludes a, form and form controls -->
<!ENTITY % button.content
   "(#PCDATA | p | %heading; | div | %lists; | %blocktext;; |
    table | %special; | %fontstyle; | %phrase; | %misc;)*">
<!--
 Content is %Flow; excluding a, form and form controls
-->
<!ELEMENT button　%button.content;>  <!-- push button -->
<!ATTLIST button
  %attrs;
  %focus;
  name        CDATA          #IMPLIED
  value       CDATA          #IMPLIED
  type        (button|submit|reset) "submit"
  disabled    (disabled)     #IMPLIED  >

name属性

name        CDATA          #IMPLIED

要素に識別名を付けます。name属性を使用する場合id属性が必須。属性の値は、id属性の値と同じです。省略可。

name属性は、廃止される方向ですが、過去の勧告との適合性を鑑み、XHTML™ 1.0 2'nd Edition では、id属性を使用する場合、id属性と name属性の両方を記述する事が必要です。

value属性

type属性

type        (button|submit|reset) "submit"

ボタンの型。値は、button,submit,reset から１つを選択します。省略時の値は、submit

button	ボタン	押しボタンの表示。
submit	実行	要素の含まれるFORM要素で記述したＣＧＩを起動します。
reset	リセット	要素の含まれるFORM要素内のデータを初期値に戻します。

disabled属性

disabled    (disabled)     #IMPLIED

値は disabled で、該当要素を無効にします。省略可。

使用例

　XXXX　　はHTMLサンプルです。

押しボタン部はＨＴＭＬサンプルの表示例です。

HTML記述: <p>
<button tabindex="1" accesskey="1">押しボタンです (1)</button>
</p>
表示例

HTML記述: <p>
<button tabindex="2" accesskey="2">
<img src="samp/bn.png" width="88" height="32" alt="バナー" />
IMG要素を使用したボタン (2)
</button>
</p>
表示例

W3C - HTML 4.01 Specification → 17.5 The BUTTON element より

Recall that authors must provide alternate text for an IMG element.
It is illegal to associate an image map with an IMG that appears as the contents of a BUTTON element.
ILLEGAL EXAMPLE:
The following is not legal HTML.
<BUTTON>
<IMG src="foo.gif" usemap="...">
</BUTTON>
著者は、IMG要素に代替テキストを記述しなければならない事を思い出して下さい。
BUTTONボタン要素の内容にIMG要素を使用する場合、イメージマップを使用する事は、不法です。
不法な例：
下記は正当なHTMLではありません。
<BUTTON>
<IMG src="foo.gif" usemap="...">
</BUTTON>

HTML記述: <p>
<button disabled="disabled">無効ボタン</button>
</p>
表示例

中年おっちゃんでも出来た ウェブページ作成講座 with ? mark

BUTTON要素 - 押しボタン

name属性

value属性

type属性

disabled属性

使用例

中年おっちゃんでも出来たウェブページ作成講座 with ? mark