Principi Base Accessibilité Sistema di design Guidelines Deutsch Français Italiano English I nostri principi di design Soluzioni focalizzate sull’utente Riconoscibilità Inclusione Riduzione Olistico Autoesplicativo Orientamento all’attività Adeguatezza Portale della marca FFS Logo Orologio digitale Diritti di utilizzazione Colori die base Colori addizionali Colori Off Brand Icone Icone dell'orario Pittogrammi Informazioni sull’accessibilità Über diesen Guide Contatti Letture consigliate Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Designing Coding FAQ Aiuto Processo Contribution Contatto Introduzione Base Componenti Introduzione Releases Design Tokens Componenti Introduzione Base Informations Introduzione Base Componenti Introduzione Power-Apps Banner pubblicitari digitali SAP IA Design : Base. Icone delle app Questa pagina non è disponibile nella lingua desiderata. Lingue disponibili: Deutsch English Tab Info

Was macht die Komponente?

Sie ist Teil der Tab-Group-Komponente.

Wann soll die Komponente eingesetzt werden?

  • Nur innerhalb der Tab-Group-Komponente.
Tab-Group
Anatomie

Anatomie der Komponente


Nummer Typ Beschreibung Optional Hinweis
1a Komponente sbb-tab-label Nein Aktiver Zustand
1b Komponente sbb-tab-label Nein Default Zustand
2 Komponente sbb-tab Nein
Demo Default
HTML in Zwischenablage kopiert.
Implementation

The sbb-tab is a component used to provide content to a sbb-tab-group
(see sbb-tab-group for more details).

<sbb-tab> Content </sbb-tab>

Slots

The content is projected in an unnamed slot.
Use a semantic element as a content wrapper (p, article, section and so on)
to improve screen-reader usability due to its implicit role.

<sbb-tab>
  <section>Content</section>
</sbb-tab>

Events

Consumers can listen to the active event on the sbb-tab component to intercept the activation event.

Accessibility

The role and the id for the aria-controls attribute is managed directly by the sbb-tab-group component.

Properties

Name Attribute Privacy Type Default Description
group - public SbbTabGroupElement | null Get the parent sbb-tab-group.
label - public SbbTabLabelElement | null The sbb-tab-label associated with the tab.

Events

Name Type Description Inherited From
active Event The active event fires when the sbb-tab has been activated via user selection on the sbb-tab-label.

Slots

Name Description
Use the unnamed slot to provide content.