837 B
837 B
label
Label is used to provide a name or title for an input field. Label can be placed before or after the field
Class names
- component:
label,floating-label
Syntax
For regular label:
<label class="input">
<span class="label">{label text}</span>
<input type="text" placeholder="Type here" />
</label>
For floating label:
<label class="floating-label">
<input type="text" placeholder="Type here" class="input" />
<span>{label text}</span>
</label>
Rules
- The
inputclass is for styling the parent element which contains the input field and label, so the label does not have the 'input' class - Use
floating-labelfor the parent of an input field and a span that floats above the input field when the field is focused