Form Elements in HTML
?? Form Elements in HTML
Forms let users submit data on a webpage. HTML provides many elements to create interactive forms.
Common Form Elements
| Element | Purpose | Example |
|---|---|---|
<form> | Container for form controls | <form action="/submit" method="POST"> |
<input> | Various input types (text, password, checkbox, radio, etc.) | <input type="text" name="username"> |
<textarea> | Multi-line text input | <textarea name="message"></textarea> |
<label> | Label for form elements (improves accessibility) | <label for="email">Email:</label> |
<select> | Drop-down list | <select name="color"><option>Red</option></select> |
<option> | Options inside <select> | See above |
<button> | Clickable button | <button type="submit">Send</button> |
<fieldset> | Group related form elements | <fieldset><legend>Details</legend>...</fieldset> |
<legend> | Caption for <fieldset> | See above |
<datalist> | List of predefined options for an <input> | <input list="browsers"><datalist id="browsers"><option value="Chrome"></datalist> |
Examples
Text Input with Label
<label for="name">Name:</label><input type="text" id="name" name="name" required>Radio Buttons
<p>Choose your gender:</p><label><input type="radio" name="gender" value="male"> Male</label><label><input type="radio" name="gender" value="female"> Female</label>Checkbox
<label><input type="checkbox" name="subscribe" checked> Subscribe to newsletter</label>Dropdown Select
<label for="country">Country:</label><select id="country" name="country"> <option value="us">USA</option> <option value="ca">Canada</option></select>Textarea
<label for="message">Message:</label><textarea id="message" name="message" rows="4" cols="30"></textarea>Submit Button
<button type="submit">Submit</button>Want me to help you build a full form example or explain how form validation works?