Breadcrumbs
Breadcrumbs are a common metaphor used in web design to indicate to the user what their current location is inside a navigation tree. It is similar to a file path inside Windows Explorer. Breadcrumbs are ideal for a site with many sub-navigation levels, and they allow the user to navigate between the various parent and child pages.
In the following markup, we'll use a combination of Razor and HTML to build a breadcrumb component with which the user can navigate back to the Home page or the Manage page:
<ol class="breadcrumb"> <li class="breadcrumb-item"><a href="#">Home</a></li> <li class="breadcrumb-item"><a href="#">Search</a></li> <li class="breadcrumb-item active">Employees</li> </ol>
The preceding markup contains an ordered list <ol>
element with a class name of .breadcrumb
. Each child element of the breadcrumb is added as a list item <li>
element...