What is an HTML form and how can we implement it?

What is HTML?

HTML : The HTML is called Hypertext Markup Language. HTML is widely used to build websites.

Applications of HTML:

• It is widely used in Web pages development.
• Internet navigation.

What is form?

HTML Form: An HTML Form is defined as something that takes user input. Information or Input can be of any type. It can be text, radio buttons, checkboxes, text area, etc.

Forms can be more responsive if we add some JavaScript to them. We can also use CSS to better style the forms. The form can be created using the <form> tags in HTML.

Attributes of form tag:

action: The action keyword is used to give the location where we want our form data to be saved when we submit the form.

Example: action= send.php Here, send.php is the page where our data will be stored after submitting the form.

target : The target attribute is used to specify a particular place where our form needs to be displayed.

Example : target= _blank

Here, _blank is used to open the document or page in a new window.

method : It is used to specify how to send the data, i.e., to send the data securely or non-securely.

Generally, we have two methods in form:

• GET
• POST

GET : It is used when we want to send the non-secure data.

We don’t use GET method in the form because it is not as confidential as the POST method.

Example: It shows the passwords in the URL link.

POST: We use the POST method to send confidential data over the page. In this method, the passwords cannot be traced in the URL.

What are key components in HTML form?

In the form above, we have used the key components:

• Input field
• Select menu
• Checkboxes
• Radio buttons
• Text area.

These components are mandatory to create a responsive form

Input field: It is used to add text input into the form.

Example of input field:

Select menu: These are used to create a menu with options in it. Select menu is mainly used to select one option from a dropdown menu.

Example of select menu:

Checkboxes: These are used for taking one or more input from the user. Checkboxes are mostly used in the form where the user wants to select more than one option.

Radio buttons: These are used to select only one input at a time. Radio buttons are mostly used in the fields where we have to choose only one specified input.

Along with these components, we also have:

• used CSS inline styling to style our HTML form
• added a background image
• used the hover property for highlighting the specified row in our form

Finally, we have used the submit and reset buttons.

The submit button is used to submit the form and the reset button to reset the values to the original state.

After we fill out the form, the data entered gets added to the database for further reference.

Code for creating a Form: