Breadcrumb

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.

How to Use

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.

Note

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.

Related Tutorial
Follow Us
https://www.facebook.com/Rookie-Nerd-638990322793530 https://twitter.com/RookieNerdTutor https://plus.google.com/b/117136517396468545840 #
Contents +