Zur Navigation Zum Inhalt Kontakt Menu Trouver un composant Aperçu Lyne Principes Bases Accessibilité Système de design Guidelines Deutsch Français Italiano English Nos principes de design Centré sur l’utilisateur Reconnaissable Inclusif Minimaliste Holistique Auto-explicatif Axé sur les tâches Approprié Portail de la marque CFF Logo Horloge numérique Droits d’utilisation Couleurs de base Couleurs fonctionnelles Couleurs off-brand Icônes Icônes de l’horaire Pictogrammes À propos de l’accessibilité À propos de ce guide Contact Informations complémentaires Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Conception Développer FAQ Aide Procès Contribution Contact Aperçu Base Composants Aperçu Base Composants Aperçu Base Composants Aperçu Design Tokens Composants Releases Aperçu Base Informations Sens & objectif Community Assets Instructions Power-Apps Bandeaux publicitaires numériques SAP Icônes d’applications
Trouver un composant

Lyne

Basics Animation Animation Border Border Grid Grid Spacings Spacings Typografie Typografie Components Action-Group Action-Group Alert Alert Alert-Group Alert-Group Autocomplete Autocomplete Button Button Calendar Calendar Card Card Card-Badge Card-Badge Checkbox Checkbox Checkbox-Group Checkbox-Group Chip Chip Clock Clock Datepicker Datepicker Dialog Dialog Divider Divider Footer Footer Form-Error Form-Error Form-Field Form-Field Header Header Header-Action Header-Action Icon Icon Image Image Journey-Header Journey-Header Link Link Link-List Link-List Logo Logo Menu Menu Menu-Action Menu-Action Tooltip Tooltip Tooltip-Trigger Tooltip-Trigger Radio-Button Radio-Button Radio-Button-Group Radio-Button-Group Selection-Panel Selection-Panel Signet Signet Slider Slider Tab-Group Tab-Group Tab Title Tab Title Tag Tag Tag-Group Tag-Group Teaser Teaser Teaser-Hero Teaser-Hero Time-Input Time-Input Title Title Toggle Toggle Toggle-Check Toggle-Check
Cette page n'est pas disponible dans la langue souhaitée. Langues disponibles Deutsch English Divider Implementation

The sbb-divider is used to visually divide sections.

Style

Based on the orientation property, the sbb-divider can be displayed vertically or horizontally.

It's also possible to display the component in negative variant using the self-named property.

<sbb-divider orientation="vertical"></sbb-divider>

<sbb-divider negative></sbb-divider>

Properties

Name Attribute Privacy Type Default Description
negative negative public boolean | undefined false Negative coloring variant flag
orientation orientation public SbbOrientation | undefined 'horizontal' Orientation property with possible values 'horizontal' | 'vertical'. Defaults to horizontal.
Demo
Orientierung Horizontal Vertikal Hintergrund White Milk Iron Charcoal Black
Beispiele Divider Horizontal
Divider Vertical
Divider Negative
HTML-Markup kopiert.
Impressum Contact Paramètres des cookies