Komponenter
Label
Label fungerer som ei tydeleg og tilgjengeleg etikett som fortel brukaren kva eit tilhøyrande skjemaelement handlar om.
HTML
Unable to parse html
const Preview = () => { return <Label>Fødselsnummer (11 sifre)</Label>; }; render(<Preview />)
Bruk
Bruk klassenavnet ds-label for å style et HTML <label>-element.
Bruk data-weight for å sette fontvekt.
CSS variabler og data-attributter
Størrelsar styrast med data-size og fargar med data-color. Komponenten vil arve næraste forelder med desse satt.
Ingen relevante css-variabler funnet.
| Navn | Verdi |
|---|---|
| data-weight | semibold, regular |
Eksempel
Vekter
HTML
Unable to parse html
const Weights = () => { return ( <> <Label weight='regular'>Regular weight</Label> <Label weight='medium'>Medium weight</Label> <Label weight='semibold'>Semibold weight</Label> </> ); }; render(<Weights />)
React
- weight
- Description
Adjusts font weight. Use this when you have a label hierarchy, such as checkboxes/radios in a fieldset
- Type
"regular" | "medium" | "semibold"- Default
medium
- asChild
- Description
Change the default rendered element for the one passed as a child, merging their props and behavior.
- Type
boolean- Default
false
| Name | Type | Default | Description |
|---|---|---|---|
| weight | "regular" | "medium" | "semibold" | medium | Adjusts font weight. Use this when you have a label hierarchy, such as checkboxes/radios in a fieldset |
| asChild | boolean | false | Change the default rendered element for the one passed as a child, merging their props and behavior. |