4 description: Indicate the current page's location within a navigational hierarchy.
8 Indicate the current page's location within a navigational hierarchy. Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content).
11 <ol class="breadcrumb">
12 <li class="breadcrumb-item active">Home</li>
14 <ol class="breadcrumb">
15 <li class="breadcrumb-item"><a href="#">Home</a></li>
16 <li class="breadcrumb-item active">Library</li>
18 <ol class="breadcrumb">
19 <li class="breadcrumb-item"><a href="#">Home</a></li>
20 <li class="breadcrumb-item"><a href="#">Library</a></li>
21 <li class="breadcrumb-item active">Data</li>
25 Similar to our navigation components, breadcrumbs work fine with or without the usage of list markup.
28 <nav class="breadcrumb">
29 <a class="breadcrumb-item" href="#">Home</a>
30 <a class="breadcrumb-item" href="#">Library</a>
31 <a class="breadcrumb-item" href="#">Data</a>
32 <span class="breadcrumb-item active">Bootstrap</span>