Breadcrumb is 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 in Windows Explorer. Breadcrumb is ideal for a site with many subnavigation levels and allows the user to navigate between the varied 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>@Html.ActionLink("Home","Index","Home")</li>
<li>@Html.ActionLink("Manage", "Index", "Manage")</li>
<li class="active">Categories</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. To indicate to the user that the last level of the breadcrumb is the active page, we set its...