<button>

要素の説明

<button>は、<input type="button">と同様の機能を持つ要素です。機能は同じですが、画像などを使うこともできるので自由度がある程度高くなっています。

指定できる属性

id
ページ内に1つ、特別な役割を与える時に指定します。
class
ページ内に複数、特別な役割を与える時に指定します。
type
ボタンの種類を指定します。
submit:送信ボタン
reset:リセットボタン
button:汎用ボタン
name
部品に名前をつけます。
disabled
ボタンを変更も選択も不可能にします。

中に入れられる要素

<button>には、フォーム以外のブロック要素やインライン要素を入れることができます。

サンプル

サンプルページ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "https://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>サンプルページ</title>
</head>

<body>
 <div id="header">
  <h1>サンプルページ</h1>
  <p>このページはサンプルを表しています。</p>
 </div>
 <h2>コンテンツ</h2>
 <form>
  <p>送信ボタン:<button type="submit" disabled>送信</button></p>
  <p>リセットボタン: <button type="reset">リセット</button></p>
  <p>汎用ボタン:<button type="button">ボタン</button></p>
 </form>
</body>

</html>