Label
Label is a container for form elements with useful utilities.
Overview
Label provides a text label, positioning, alignment, and accessibility helpers for wrapped control components. Its layout
property can be modified for different displays, depending on the use case of the labeled component.
Usage
- A container for form elements, which provides layout and context for components such as Input, Checkbox, Combobox, Radio Button, Slider, Switch, etc.
- As a visual anchor for sections of content
Sample
Accessibility
Label should accompany all form-based controls, including Inputs, Checkboxes, Radio buttons, and Dropdowns. It provides a purposeful description to the form control supporting a more diverse audience and assistive technologies.
Components can be wrapped with a Label, or use the for
property, where the value is represented by the associated component's id
value. Learn more about the label for
attribute on MDN.
Writing and copy
