Breadcrumb
Navigational hierarchy
Demo
See more examples
API
Tag
| Name | Type | Content | |||||||
|---|---|---|---|---|---|---|---|---|---|
m-breadcrumb |
Custom tag | One <nav> child with <a>, <span>, or <m-crumb> children. |
|||||||
m-crumb |
Custom tag | Any | |||||||
Guidelines
Crumb order
The last crumb must represent the current page and should be a span. All other crumbs should be links navigating up the hierarchy. When the user is at the top of the hierarchy, it may or may not make sense to display Breadcrumb at all.
With menus
Breadcrumbs can support all kinds of elements for more demanding designs, but you should not deviate from the core purpose of navigational hierarchy.
Accessibility
It is recommended that the last item in breadcrumbs has aria-current="page".