HTML Tutorial / Explain Forms with fieldset, legend, and autocomplete
Use fieldset to group related form controls and legend to state the group's question. For fields such as a person's name or email address, a suitable autocomplete token can tell the browser what information the field requests.
Group one question with fieldset and legend
Individual radio labels describe the answers, but users also need the question those answers belong to. legend provides that group name.
<fieldset> <legend>How should we contact you?</legend> <label><input type="radio" name="contact" value="email"> Email</label> <label><input type="radio" name="contact" value="phone"> Phone</label> </fieldset>
Open the example in a browser: a border and legend may appear by default. CSS can change that appearance without removing the relationship. The two radio inputs share name="contact" so choosing one clears the other. Use a separate fieldset for a separate question, and a different radio-group name; otherwise selecting an answer in one question could clear an answer in another.
Describe an input's purpose with autocomplete
<form action="/contact" method="post">
<fieldset>
<legend>Contact details</legend>
<label for="full-name">Full name</label>
<input id="full-name" name="full_name" autocomplete="name">
<label for="email">Email address</label>
<input id="email" name="email" type="email" autocomplete="email">
</fieldset>
<button type="submit">Send</button>
</form>
autocomplete="name" and autocomplete="email" describe the fields' purposes. They do not set a fixed value or submit information on behalf of the user. Whether a suggestion appears depends on browser settings and stored information. The name attribute is the server-side key; the autocomplete token is an input-purpose hint. /contact is an illustrative path and needs a server handler.
Check grouping and autofill
Do not put unrelated questions inside one fieldset, and do not scatter one radio question without a group name. Use defined autocomplete tokens rather than arbitrary words. Test two independent radio groups: if choosing an answer in the second clears the first, their name values probably match by mistake. Autofill does not validate the user's information, and forms collecting personal data still need suitable security and privacy practices. See the MDN autocomplete reference and fieldset reference.
HTML Tutorial / Form Structure and GET vs. POST
Understand how form action, method, and control names determine where form values go, and when GET or POST is appropriate.
Learn the essential rules of HTML syntax, including elements, tags, attributes, void elements, comments, nesting, and the structure of a complete HTML document.
HTML Tutorial / Table Basics: table, tr, th, and td
Build a basic HTML data table with rows and header or data cells, then organize its headings and body without using tables for page layout.
HTML Tutorial / Headings and Paragraphs
Learn when to use h1–h6 headings, p paragraphs, and br line breaks in HTML. Examples show document hierarchy, browser output, and common mistakes.
HTML Tutorial / Form Validation with required, Length, and Range Limits
Apply built-in required, length, and numeric constraints, test error states, and understand why server-side validation remains necessary.
HTML Tutorial / Use textarea, select, option, and button
Create multi-line fields, selection lists, and form buttons while understanding initial values, submitted values, and reset behavior.
HTML Tutorial / Add Placeholder Text to Form Fields
Learn how to add placeholder hints to HTML input and textarea fields without confusing them with labels or initial values. Includes a complete form example, required-field checks, and an explanation of empty values in submitted data.
HTML Tutorial / Explain Forms with fieldset, legend, and autocomplete
Group related controls with fieldset and legend, and use suitable autocomplete tokens to describe the purpose of input fields.
HTML Tutorial / Responsive Images: srcset, sizes, and picture
Offer image resolutions with srcset and sizes, and switch crops with picture. Downloadable files let you test the examples in a browser.
HTML Tutorial / Accessible Tables: caption, scope, and Spanning Cells
Make table headings and data relationships clear with caption, th, and scope, and learn when colspan or rowspan makes a table harder to read.