html

Three HTML Button Types

A button is considered as one of the most important elements of a web page as it allows you to take some action after inserting your data. HTML provides three different types of buttons. In this article, we will walk you through the usage as well as the implementation of all three types of buttons in HTML. 

What are the Three Types of Buttons in HTML?

The buttons used in HTML are broadly classified into three different categories. All the three types of HTML buttons are discussed below:

  • The Submit Button- This button is used for submitting the current data entered into a web form.
  • The Reset Button- This button is used for resetting all the currently entered data within a web form.
  • The Simple Clickable Button- This is a simple HTML button that is used for triggering any associated event.

How to use the Three Types of Buttons in HTML?

For using all the three types of buttons in HTML, we have created the following HTML script:

In this example, we have created two text input fields for collecting the first name and last name of the users. Then, we provided three different buttons in this HTML script. The first button will be used for submitting the first and last name entered. The second button will be used for resetting the entered input. And the last button will be used to trigger an associated event. However, in this HTML script, we have confined ourselves to the creation of these buttons because of which we have not defined any associated trigger events.

The web page shown in the image below appeared on our browser when we executed the above-mentioned HTML script. This web page shows all three types of buttons in HTML.

Conclusion

This tutorial was meant for conveying the usage of the three types of buttons in HTML. For doing that, we briefly taught you the purpose of all the three types of buttons followed by an HTML script that implemented all of these buttons. Once you will learn the creation of buttons in HTML, you can easily pair up this script with PHP or JavaScript for performing certain actions once these buttons are clicked.

About the author

Ayesha Sajid

Ayesha Sajid has secured a Bachelor's degree in Computer Sciences and a Master's degree in Information Security. She is a technical content writer by profession who has around four years of experience in working with Windows and different flavors of the Linux operating system. She also has a keen interest in exploring the latest technology trends.