FREE HTML CODE
Search HTML Code

HTML Button

Using the <input> Tag
This example uses the <input> tag to create a basic button. Within the code, we use type="button" to set the control to a button.
In this example, we've added JavaScript to display a message to the user once they click the button.

Example:
Code:


Using the <button> Tag:

This example uses the <button> tag to create the button. This is a tag specifically for creating buttons.

The type attribute accepts 3 possible values; button, submit, and reset
Example:
Code:



HTML Button with Image:

One of the cool things about the <button> tag is that it allows you to place HTML code between the <button> and </button> tags. This example combines an image and some text.
Example:

Code:


Difference Between the <input> Tag and <button> Tag:


At first glance, it may appear that there's not much difference between using the <button> tag and <input> tag. But there are some differences.
The main difference is that the <button> tag allows you to place HTML code in between the opening and closing tags. The <input> tag is an empty tag (i.e. it doesn't have a closing tag), so you can't add content to the tag.
Another key difference between the two tags is with the value attribute. The <input> tag uses this attribute to display a label on the button (e.g. "Click me!"). With the <button> tag, on the other hand, the value attribute is submitted along with any form contents and can be used for processing.
| More