Elements – Button Tag


Button Tag

A <button> tag specifies a clickable button on the HTML document.
Between the <button> tags, you can put content, like text or images. This is different from the button created using <input> tag, which only takes text as content.

Syntax:

<button type="submit">Click Here!</button>

Atributes:

Following are the associated attribute supported by HTML 4:

AttributesValueWhat it does
disableddisabledDisables the button
namenameSpecifies a name for the button. The name is for referencing the button in HTML form, JS, etc.
typebutton or reset or submitSets the type of the button. A button with button type is a simple clickable button, with submit type it submits form-data, and with reset type it resets form-data.
valuetextSets an initial value for the button. This value is sent along with the form-data.

HTML 5 supports the following extra attributes:

AttributesValueWhat it does
autofocusautofocusShould the button automatically get focus when the page loads. For example, see Google. As the page gets loaded completely, the text-box get focus automatically.
formform_idSpecifies one or more forms the button belongs to.
formactionURLSpecifies where to send the form-data once the submit type button is pressed.
formmethodget or postSpecifies how to send the form-data. Only for submit type button.
formtarget_blank or _self or _parent or _top or framenameSpecifies the location where the result is to be displayed after submitting form-data.

Example:

<html> <head> <title>Button Tag example</title> </head> <body> <form> First name:<br> <input type="text" name="firstname" value="Free"> <br> Last name:<br> <input type="text" name="lastname" value="CodeCamp"> <br><br> <input type="submit" value="Submit" formtarget="_self"> </form> </body> </html>

All major browsers support the <button> tag. <button> tag also supports event attributes in HTML.
Note: Different browsers may send different values if you use <button> element. It is advised to either specify the button value or use the <input> tag to create button in an HTML form.

Other resources:

  • Other attributes:
AttributesLink
formenctypehttps://www.w3schools.com/TAgs/att_button_formenctype.asp
formnovalidatehttps://www.w3schools.com/TAgs/att_button_formnovalidate.asp
  • <input> tag: https://www.w3schools.com/TAgs/tag_input.asp
  • Event Attributes: https://www.w3schools.com/TAgs/ref_eventattributes.asp
  • formtarget attribute values: https://www.w3schools.com/TAgs/att_button_formtarget.asp
  • HTML Form:

This article needs improvement. You can help improve this article. You can also write similar articles and help the community.