Today we will learn how to create html form whenever we fill the website or form of Railway, College or E-commerce website like – Flipkart, Amazon, Myntra and college. In which we fill things like name, email, password, age, phone, number etc., which we make with the help of html and with the help of CSS the form is styled.
After filling the form, when we send it, the details filled by you reaches the website owner, which we call html form.
How to make form in html
To create the form in html, first of all we have to download any one of the text editor like – notepad, notepad++, sublime or vs code on our computer and a web browser like – google chrome, mozillafirefox, safari etc. Download a browser.
After installing the text editor, open it and save a file named index.html in it, whatever we will write the class for the form, we will write it inside the index.html file and save the index.html file in your folder to any We will open it in a web browser, where we will see the form, how to create the form has been told further.
Form format in html and how to create form tag in html in english
Many tags are used to create forms in html. The ones that are used the most have been told.
1. How to create a form in html using <form> tag
The form tag is used to create a form in html, it acts like a box inside which we have to keep all the things of the form. Many tags are used to create forms in html.
2.<input> tag :-
Input tag is the most important tag used for the form when any user who fills the data like – his name, email, phone, age etc. to fill the form. For that input tag is used, with input we use many type attribute to create form.
Many tags are used to create forms in html.
3.<textarea> tag :-
If any text exceeds one line, then for that we use textarea like – to write a comment, and to write a review. Rows means row and cols means column are used in textarea.
From rows, we can set the width and height of the textarea from cols, the more cols, rows you will increase, the width and height of the textarea will increase.
4.<label> tag :-
Sometimes the user has trouble clicking on small radio buttons, and checkboxes, that is, we do not click, for this we use labels. If someone clicks on the text written inside the label, then the radio button or checkbox is selected with it, for this the id inside the input and the data inside the label should be the same.
5.<option> tag :-
The <option> tag is used to select a list such as the names of countries, states, cities. In this, a dropdown is created with a button from where we can select any one name from the list and the <option> tag is placed inside the <select> tag.
6.<select> tag :-
<select> tag is used to create dropdown of a list, inside <select> tag we use <option> tag.
7.<button> tag :-
The <button> tag is used to create a button for the form, so that we can submit and cancel the form.
Input types in html form – How to create html form using input types
There are many input types in the form which are used to create the form. Like – text, button, checkbox, password, radio, date, email, file, hidden, image, month, range, search, number, time, url, week, tel, submit etc.
1. How to create <input type=”text”> form in html
You have to type the text in the form like you have to write your first name, email, password, phone number or last name. For that we use input type = “text”.
To type anything in the form, a box is created, which we call form-control, inside which we can type anything.
If you have not typed anything inside the form-control, then at that place you will be shown the first name or the one which is placed inside your placeholder will be shown. The placeholder acts as a hint that tells us what to type here
As soon as you type something in the form control, the placeholder automatically disappears because it acts as a hint. If we want to write our name then it is necessary to write these three together which is used for every type of text form.
2. <input type=”password”>
With password we can write the password inside the form-control, the password which we do not see appears as xxxxxxxx.
3. <input type=”radio”>
With radio, we can create a radio button in the form, which is used to select any one of the many options.
4. <input type=”checkbox”>
Like radio, we use checkbox which we use to make checkbox. If we check in the box then it gets checked so that we can check many checkboxes simultaneously.
5. <input type=”button”>
When we fill the complete form and after filling all the details in it the form is submitted for which we create a submit button.
In addition to <input type=”button”> in html form, you can create a submit button using a tag.
6. <input type=”email”>
type email is like the same <input type=”text”> but type email is used only to write the email address within which we write the email.
How to create form using html form method and get and post method in html
The method in html is used to show and hide the data when the form is submitted. There are two types of methods in the html form. get method and post method.
What is the difference between Get method and Post Method?
We submit the form in the get method, after that the data is not visible to the user, after submitting the form in the post method; the data is visible to the user.
If we want to build an html form, the complete code for that is written below so that we can create the form.
If you want to learn advance things about how to create a form in html, then you can learn from bootstrap’s website.
How to create form in html, html form tags and form method is explained in simple language, if you have any problem in creating html form, you can ask your question in below comment box.