Breadcrumbs

Breadcrumbs or breadcrumb trail is a navigation aid used in user interfaces. It allows users to keep track of their location within programs, websites or documents.

Breadcrumbs layout with links can be separated by any symbol, for example > symbol.

The following markup corresponds to the accesibility demands:

<div class="example-breadcrumbs-1"> <span class="label" id="breadcrumb-label">You are here:</span> <ul class="items" aria-labelledby="breadcrumb-label"> <li class="item home"> <a title="Go to Home Page" href="#">Home</a> </li> <li class="item category1"> <a title="Category" href="#">Category</a> </li> <li class="item category2"> <a title="Category" href="#">Subcategory</a> </li> <li class="item category3"> <strong>Products</strong> </li> </ul> </div>

.example-breadcrumbs-1 {
    .lib-breadcrumbs();
}