Fondazione - Breadcrumb di navigazione

Descrizione

Un breadcrumb specifica la posizione corrente di un sito all'interno della gerarchia di navigazione. È utile quando si accede a un numero elevato di pagine di un sito Web. Un breadcrumb in Foundation è semplicemente un elenco non ordinato con una classe di .breadcrumb . Per informazioni dettagliate consultare questo capitolo .

Riferimento SASS

Variabili

È possibile modificare gli stili dei componenti utilizzando le seguenti variabili SASS elencate nella tabella.

Sr.No. Nome e descrizione genere Valore predefinito
1

$breadcrumbs-margin

Attorno al contenitore del breadcrumb viene impostato il margine.

Numero 0 0 $ margine globale 0
2

$breadcrumbs-item-font-size

Imposta la dimensione del carattere per l'elemento breadcrumb.

Numero rem-calc (11)
3

$breadcrumbs-item-color

Imposta il colore per l'elemento breadcrumb.

Colore $ colore-primario
4

$breadcrumbs-item-color-current

Imposta il colore per l'elemento breadcrumb corrente.

Colore $ nero
5

$breadcrumbs-item-color-disabled

L'elemento breadcrumb è disabilitato.

Numero $ grigio medio
6

$breadcrumbs-item-margin

Imposta il margine tra gli elementi breadcrumb.

Numero 0.75rem
7

$breadcrumbs-item-uppercase

Rende l'elemento breadcrumb in maiuscolo.

Booleano vero
8

$breadcrumbs-item-slash

Include una barra tra gli elementi breadcrumb.

Booleano vero

Mixin

Puoi usare i mixin per costruire la struttura della classe CSS per i tuoi componenti come elencato nella tabella -

contenitore per pangrattato

Include gli stili per il contenitore breadcrumb con lo stile per l'elemento <li> <a> presente al suo interno.

@include breadcrumbs-container;