Breadcrumbs
Now that we improved our navigation bar, we can expand the range of available content on our site. Although we won't add more content as part of our demo website, we should consider how we can help the user navigate sets of nested pages without getting lost. To this end, Bootstrap allows us to easily use a user interface control called breadcrumbs. Wikipedia defines this control as follows:
"Breadcrumbs or breadcrumbs trail is a graphical control element used as a navigational aid in user interfaces. It allows users to keep track of their locations within programs, documents, or websites. The term comes from the trail of breadcrumbs left by Hansel and Gretel in the fairy tale of the same name."
Creating breadcrumbs is very straightforward; all that is required is to apply the breadcrumb class to an ordered list element (ol), and then apply breadcrumb-item to the individual list items. A crumb can be marked as active using the active class:
<ol class="breadcrumb">
<...
