push button

<button type="">

Browser
Internet Explorer Firefox Opera
Type
Inline-block

The BUTTON element defines a submit button, reset button, or push button.

<button type="button">button content</button>

<button type="submit" name="name" value="example">button content</button>

Attribute Value Explanation
type=" " submit creates a submit button
reset creates a reset button
button creates a push button
name=" " button name a unique name for the button
value=" " initial value this value is submitted

The content of the BUTTON element is displayed on the button.

For example,

<button type="button">Button Content</button>

<button type="button"><strong>Button Content</strong></button>

<button type="button"><img src="piyo.gif" alt="PiyoPiyo" width="50" height="50"></button>

type="submit"

Creates a submit button on the form.

When this button is clicked, the form data is submitted to the server.

type="reset"

Creates a reset button on the form.

When this button is clicked, the input is reset.

type="button"

Creates a general purpose button.

name=""

The button name is used to identify the clicked button.

value=""

This value is submitted to the server when the button is clicked.

Tips and Notes

The style of the button can be changed with CSS. Please see the "Related Document" for details on CSS.

Example

The submit button and the reset button

<form method="POST" action="example.cgi">

<p><input type="text" name="name" size="30"></p>

<p>
<button type="submit"><big>Submit</big></button>
<button type="reset"><small>Reset</small></button>
</p>

</form>
Output

This form cannot submit because of a sample.

The push button

<p>
<button type="button" onClick="alert('Example')">
<img src="image/mark.gif" alt="Alert Button" width="47" height="42"><br>Alert
</button>
</p>
Output