Example in Action: How to Structure a Web Form
When building a form, you want to make sure you are using a basic structure that still covers all you need to cover. Building your forms with dedicated form elements and attributes will help ensure your form is usable and accessible.
The <form> element
The <form>
element formally defines a form and attributes that determine the
form's behavior. Each time you want to create an HTML form, you must
start it by using this element, nesting all the contents inside. Many
assistive technologies and browser plugins can discover <form> elements and implement special hooks to make them easier to use.
Warning: It's strictly forbidden to nest a form inside another form. Nesting can cause forms to behave unpredictably, so it is a bad idea.
It's always possible to use a form control outside of a <form> element. If you do so, by default that control has nothing to do with any form unless you associate it with a form using its form attribute. This was introduced to let you explicitly bind a control with a form even if it is not nested inside it.
Let's move forward and cover the structural elements you'll find nested in a form.