مثال پیشفرض#
از لیستهای مرتب یا نامرتب با موارد لینک شده برای ایجاد یک مسیر ناوبری با حداقل سبک استفاده کنید. از ابزارهای ما برای اضافه کردن استایلهای اضافی در صورت نیاز استفاده کنید.
<!-- مسیر ناوبری پیشفرض -->
<nav aria-label="breadcrumb">
<ol class="breadcrumb py-0">
<li class="breadcrumb-item active" aria-current="page">خانه</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb py-0">
<li class="breadcrumb-item"><a href="javascript:void(0);">خانه</a></li>
<li class="breadcrumb-item active" aria-current="page">کتابخانه</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-0 py-0">
<li class="breadcrumb-item"><a href="javascript:void(0);">خانه</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0);">کتابخانه</a></li>
<li class="breadcrumb-item active" aria-current="page">داده</li>
</ol>
</nav>
مسیر ناوبری با جداکنندهها#
بهطور اختیاری همچنین میتوانید آیکون را با مورد مسیر ناوبری خود مشخص کنید.
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ol class="breadcrumb py-0">
<li class="breadcrumb-item active" aria-current="page">خانه</li>
</ol>
</nav>
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ol class="breadcrumb py-0">
<li class="breadcrumb-item"><a href="javascript:void(0);">خانه</a></li>
<li class="breadcrumb-item active" aria-current="page">کتابخانه</li>
</ol>
</nav>
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ol class="breadcrumb mb-0 py-0">
<li class="breadcrumb-item"><a href="javascript:void(0);">خانه</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0);">کتابخانه</a></li>
<li class="breadcrumb-item active" aria-current="page">داده</li>
</ol>
</nav>