The Form Element
Learn how the <form> tag works as a container, and understand the action and method attributes that control where and how data is sent.
The <form> element is a container
The <form> element is the foundation of every HTML form. It serves as a container — a wrapper — that groups all the form fields together and tells the browser: "Everything inside me is part of one form submission."
Without a <form> element, your input fields are just standalone widgets on the page. They look the same visually, but the browser does not know they belong together, and clicking a submit button does nothing meaningful. The <form> element is what connects all the fields into a single, submittable unit.
Here is the simplest possible form:
<form>
<input type="text" name="query">
<button type="submit">Search</button>
</form>
Even this minimal form works — when the user types something and clicks the button, the browser will collect the data from the input and attempt to submit it. The <form> element makes that possible.
<form> element like a clipboard holding a questionnaire. The clipboard itself isn't a question — it's the thing that holds all the questions together in one place. Without the clipboard, you'd just have loose papers scattered around. The clipboard also has a label on top telling the receptionist where to file the completed form. Similarly, the <form> element holds all your inputs together and carries the instructions (attributes) for where to send the data.<form> elements, and each one submits independently. For example, a page might have a search form in the header and a login form in the main content. However, forms cannot be nested — you cannot put a <form> inside another <form>. The HTML specification explicitly forbids this, and browsers will produce unexpected behavior if you try.