Ways to create Buttons
Last time we have seen, Inserting an Image in the Webpage. Now we are going to learn about Ways to create Buttons in HTML. So let's get started...
Buttons in HTML
The Buttons can be used to perform a specific task and it also makes the webpage interactive. In HTML, the button is nothing but a component that is used to generate an event defined by the developer.
The HTML Buttons can be created using two ways. The first one is by using the <button> tag and another one is by using the <input> tag of the Form element. So let's see those two ways one by one...
Ways to create Buttons
1. By using <button> Tag
This tag is used to create a simple button with the Text String defined by the developer. It has basic attributes like class, id, name, value and so on apart from this, it has one main attribute which is "type".
The "type" attribute defines the type of button that is created or that is needed to create. The value of the type attribute can be a button, reset, submit, and so on.
Syntax :
<button type="button" >I am the Button</button>2. By using <input> Tag
This tag is not only used to create buttons but also used to create other form elements like Textfield, Checkbox, Radiobutton, and so on.
This tag also uses "type" attribute to specify the type of the Component element. It also requires another attribute as a "value", which is used to assign the title to the Button.
Syntax :
<input type="button" value="I am the Button" >Different Types of Buttons
| Attributes | Description |
|---|---|
| button | It defines the Simple Button |
| reset | It defines the Button which resets the values in the Form |
| submit | It defines the Button which submits the values in the Form to its respective server |
Creating Button using <button> Tag
Example :
<!DOCTYPE html>
<html>
<head>
<title>Use of Button Tag</title>
</head>
<body>
<h3>Creating Button using <button> Tag</h3>
<button type="button"> I am the Button </button>
</body>
</html>
Creating Button using <input> Tag
Example :
<!DOCTYPE html>
<html>
<head>
<title>Use of Input Tag</title>
</head>
<body>
<h3>Creating Button using <input> Tag</h3>
<input type="button" value="I am the Button">
</body>
</html>
So, now it's time to end the session. See you guys Next Time, stay tuned for further updates on HTML Programming Languages...!!!
Our website will definitely help you to improve your Programming Skills and Knowledge.
Thanks for Visiting...!!!
0 Comments
Please do not add Any Spam link in Comments !