HTML Tags
Advertisements

HTML <button> Tag

Topic: HTML5 Tags ReferencePrev|Next

Description

The <button> tag creates a clickable button in an HTML form.

Buttons created with the <button> element function just like buttons created with the input element, but they offer richer rendering possibilities; as you can put content, like text or images inside the button element. For example, a button element that contains an image functions like and may resemble an <input> element whose type is set to image.

The following table summarizes the usages context and the version history of this tag.

Placement: Inline
Content: Any block, inline, and text
Start/End Tag: Start tag: required, End tag: required
Version: HTML 4, 4.01, 5

Syntax

The basic syntax of the <button> tag is given with:

HTML / XHTML: <button type="button|reset|submit"> ... </button>

The example below shows the <button> tag in action.

<form action="action.php" method="post">
    <p>
        First name:<input type="text" name="firstname">
        <button type="submit" value="Submit">Submit</button>
        <button type="reset" value="Reset">Reset</button>
    </p>
</form>

Tag-Specific Attributes

The following table shows the attributes that are specific to the <button> tag.

Attribute Value Description
autofocus autofocus This Boolean attribute specifies that the button should automatically get focus when the document is loaded.
disabled disabled This Boolean attribute disables the button for user interaction.
form form-id Specifies the <form> element that the button element is associated with (its form owner).
formaction URL Specifies the URL of a program that processes the information submitted by the button (only for type="submit").
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain
Specifies how the form data should be encoded when submitting the form data to the server (only for method="post")
formmethod get
post
Specifies the HTTP method that the browser will use to submit the form (only for type="submit").
formnovalidate formnovalidate This Boolean attribute specifies that the form data should not be validated when it is submitted (only for type="submit").
formtarget _blank
_self
_parent
_top

framename
Specifies a target to display the response that is received after submitting the form.
name unique-name Represents the name of the button.
type button
submit
reset
Specifies the type of button.
value text Specifies the initial value of the button.

Global Attributes

Like all other HTML tags, the <button> tag supports the global attributes in HTML5.


Event Attributes

The <button> tag also supports the event attributes in HTML5.


Browser Compatibility

The <button> tag is supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 1+
  • Google Chrome 1+
  • Internet Explorer 4+
  • Apple Safari 1+
  • Opera 5+

Further Reading

See tutorial on: HTML Form.

Related tags: <form>, <input>.

Advertisements
Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties