HTML legend
Created By: chatGPT
In HTML, a
<legend>
element is used within a <fieldset>
to provide a title or description for that fieldset. This helps in grouping related elements within forms, improving usability and accessibility. The <legend>
is usually displayed at the top of the fieldset.<fieldset>
<legend>User Information</legend>
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<label for="email">Email:</label>
<input type="email" id="email" name="email">
</fieldset>
It's good practice to include a
<legend>
in your forms when using fieldsets. It gives context to the fields inside, which is particularly beneficial for users utilizing assistive technologies. Here’s a simple example that shows how to create a fieldset with a legend.<form>
<fieldset>
<legend>Contact Details</legend>
<label for="phone">Phone:</label>
<input type="tel" id="phone" name="phone">
<label for="address">Address:</label>
<input type="text" id="address" name="address">
</fieldset>
<button type="submit">Submit</button>
</form>