A breadcrumb is used to indicate the current page's location within a navigational hierarchy which allows users to keep track their locations within websites. Bootstrap automatically adds separators via CSS.
Create <ol> element and apply .breadcrumb class. Add .breadcrumb-item class for <li> items and additionally add .active class to the last item which indicates the current page.
Accessibility
Since breadcrumbs provide a navigation giving meaningful text it would be useful for the non-visual users. Add aria-label="breadcrumb" to describe the type of navigation in the <nav> element and apply aria-current="page" to the last <li> item to indicate that it represents the current page.
