Breadcrumb
Indicate the current page’s location within a navigational hierarchy. Separators are automatically added in CSS through ::before and content.
1 2 3 4 5 6 7 8 9 10 11 12 | <ol class="breadcrumb"> <li class="breadcrumb-item active">Home</li></ol><ol class="breadcrumb"> <li class="breadcrumb-item"><a href="#">Home</a></li> <li class="breadcrumb-item active">Library</li></ol><ol class="breadcrumb"> <li class="breadcrumb-item"><a href="#">Home</a></li> <li class="breadcrumb-item"><a href="#">Library</a></li> <li class="breadcrumb-item active">Data</li></ol> |
Similar to our navigation components, breadcrumbs work fine with or without the usage of list markup.
1 2 3 4 5 6 | <nav class="breadcrumb"> <a class="breadcrumb-item" href="#">Home</a> <a class="breadcrumb-item" href="#">Library</a> <a class="breadcrumb-item" href="#">Data</a> <span class="breadcrumb-item active">Bootstrap</span></nav> |
Please login to continue.