View video tutorial

HTML <button> Tag

HTML

The <button> Tag is used to submit a form or trigger a function by the user.

HTML <button> Tag


HTML <button> element is an interactive element that is activated by the user via mouse, keyboard, finger, voice commands or other assistive technology.

The type attribute should always be specified for a <button> tag.

Images and text may be used within the <button> tag.

Element Attributes

Attribute Value Description
autofocus autofocus This specifies that a button should automatically focus when the page is loaded.
disabled disabled This specifies that a button should be disabled.
form form_id Specifies which form the button belongs to.
formaction action_url Specifies where the form data should be sent when submitting the form. It is used for submit type.
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain
It specifies how the form data should be encoded before being sent to the server. Only for type="submit".
formmethod get
post
It specifies how to send form data using HTTP method. Only for type="submit"
formnovalidate formnovalidate Specifies that the form should not be validated at the time of data submission. Only for type="submit".
formtarget _blank
_self
_parent
_top
filename
It specifies where to display response after submitting the form. Only for type="submit".
name name It specifies the name of the button.
type button
reset
submit
Specifies the type of button.
value text This specifies the value of the button.

Global attributes

Global attributes may be applied on all elements, although some elements may have no effect on them.

<accesskey>, <class>, <contenteditable>, <contextmenu>, <data-*>, <dir>, <draggable>, <dropzone>, <hidden>, <id>, <lang>, <spellcheck>, <style>, <tabindex>, <title>, <translate>.

Learning with HTML Editor "Try it Now"

You can edit the HTML code and view the result using online editor.

Sample Code

Copy each file contents and paste it to your own project and run to see the final output

Example

<button type="button">Click here</button>
Try it Now »

Click on the "Try it Now" button to see how it works.