Breadcrumbs

优质

小牛编辑

127浏览

2023-12-01

描述 (Description)

面包屑指定导航层次结构中站点的当前位置。在访问网站的大量页面时非常有用。 Foundation中的breadcrumb只是一个带有.breadcrumb类的无序列表。有关详细信息，请查看chapter 。

您可以使用表中列出的以下SASS变量来更改组件的样式。

Sr.No.	名称和描述	类型	默认值
1	$breadcrumbs-margin 在面包屑容器周围设置边距。	Number	0 0 $全球保证金0
2	$breadcrumbs-item-font-size 设置面包屑项的字体大小。	Number	rem-calc(11)
3	$breadcrumbs-item-color 设置面包屑项的颜色。	Color	$primary-color
4	$breadcrumbs-item-color-current 设置当前面包屑项的颜色。	Color	$black
5	$breadcrumbs-item-color-disabled 面包屑项已禁用。	Number	$medium-gray
6	$breadcrumbs-item-margin 设置面包屑项之间的边距。	Number	0.75rem
7	$breadcrumbs-item-uppercase 使breadcrumb项目为大写。	Boolean	true
8	$breadcrumbs-item-slash 包括面包屑项之间的斜杠。	Boolean	true

您可以使用mixins为您的组件构建CSS类结构，如表中所列 -

它包含面包屑容器的样式，其中包含元素

@include breadcrumbs-container;