Zum Hauptinhalt springen

Ihre Meinung ist uns wichtig! Gemeinsam mit Ihnen möchten wir KoliBri stetig verbessern. Teilen Sie uns Ihre Ideen, Wünsche oder Anregungen mit – schnell und unkompliziert.

Heading

Die Heading-Komponente kann überall dort verwendet werden, wo eine Überschrift angezeigt werden soll. Durch die Verwendung der unterschiedlichen Größen, lassen sich Inhalte klar strukturieren und Seiten wirkungsvoll und abwechslungsreich präsentieren. Sie trennt Styling von Semantik und ermöglicht Flexibilität.

Konstruktion

<KolHeading _label="Heading" _level={1} />

Verwendung

Die Überschriftenebene wird durch das Attribut _level übergeben. Möglich sind die Level 1 bis 6

Best practices

  • Achten Sie bei der Verwendung von Headings auf die empfohlene Semantik für die Suchmaschinenoptimierung.
  • Setzen Sie Headings in verschiedenen Größen ein, um eine sinnvolle Struktur Ihrer Inhalte zu erzeugen.

API

Properties

PropertyAttributeDescriptionTypeDefault
_label (required)_labelDefines 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.stringundefined
_level_levelDefines 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 | undefined0
_secondaryHeadline_secondary-headlineDefines the text of the secondary headline.string | undefinedundefined

Slots

SlotDescription
Inhalt der Überschrift.

Beispiele