Breadcrumb面包屑导航

2024-06-19 15:05:55首发，2个月前更新

Breadcrumb意为面包屑，也可以使用crumb简称，面包屑导航主要意义是在网站项目中告诉用户当前页面在网站项目中的层级关系，并且通过层级关系迅速返回上一页或首页，类似windows系统中的文件目录层级；面包屑导航是纯css+html打造的，未进行任何封装，方便不同网站系统组合使用。

简单使用

面包屑用于本页面定位，让用户知道本页面在整个系统中所处的相对位置；使用_crumb样式类包裹，ref=label属性作为栏目名，ref=hyphen属性作为分隔符。

使用其他分隔符

ref=hyphen元素可以是任意文本内容。

使用导航头

ref=head元素表示导航的头部，可以是文本也可以是图标。

使用图标

栏目链接中除了文本，还可以插入图标。