Breadcrumb

Breadcrumb 的所有元件都以 .crumb 為開頭。

<ul class="crumb">
    <li class="crumb-text">您目前的位置:</li>
    <li class="crumb-item">
        <a class="crumb-link">首頁</a>
    </li>
    <li class="crumb-item">
        <a class="crumb-link">單元名稱</a>
    </li>
    <li class="crumb-end">媽,我在這</li>
</ul>

.crumb-text 可以移除不影響排版,也可以將裡面的文字替換成圖示。


Breadcrumb 與 Drops

你可以在任何 .crumb-item 上設置 .drop

<ul class="crumb">
    <li class="crumb-text">您目前的位置:</li>
    <li class="crumb-item">
        <a class="crumb-link">首頁</a>
    </li>
    <li class="crumb-item">
        <a class="crumb-link">單元名稱</a>
    </li>
    <li class="crumb-end">媽,我在這</li>
</ul>