Heading
The Heading component can be used anywhere a heading should be displayed. By using different sizes, content can be clearly structured and pages can be presented effectively and varied. It separates styling from semantics and allows for flexibility.
Construction
<KolHeading _label="Heading" _level={1} />Usage
The heading level is passed through the _level attribute. Levels 1 to 6 are possible
Best practices
- When using headings, pay attention to the recommended semantics for search engine optimization.
- Use headings of different sizes to create a meaningful structure for your content.
API
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
_label (required) | _label | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to false to enable the expert slot. | string | undefined |
_level | _level | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined | 0 |
_secondaryHeadline | _secondary-headline | Defines the text of the secondary headline. | string | undefined | undefined |
Slots
| Slot | Description |
|---|---|
| Inhalt der Überschrift. |