Skip to content

Latest commit

 

History

History
43 lines (36 loc) · 1.22 KB

breadcrumb.md

File metadata and controls

43 lines (36 loc) · 1.22 KB
Raw

Breadcrumb

Breadcrumb navigation

<nav aria-labelledby="breadcrumb">
    <h1 id="breadcrumb">You are here:</h1>
    <ul id="breadcrump-list">
        <li><a href="/">Main</a> →</li>
        <li><a href="/products/">Products</a> →</li>
        <li><a href="/products/dishwashers/">Dishwashers</a> →</li>
        <li><a>Second hand</a></li>
    </ul>
</nav>

Alternative version

This version uses a <p> instead of <ul> for the links (taken from WHATWG). Useful if you have more than one path:

<nav aria-labelledby="breadcrumb">
    <h1 id="breadcrumb">You are here:</h1>
    <p>
        <a href="/">Main</a> ▸
        <a href="/products/">Products</a> ▸
        <a href="/products/dishwashers/">Dishwashers</a> ▸
        <a>Second hand</a>
    </p>
    <p>
        <a href="/">Main</a> ▸
        <a href="/second-hand/">Second hand</a> ▸
        <a>Dishwashers</a>
    </p>
</nav>