Bootstrap 面包屑
在本教程中，您将学习如何使用 Bootstrap 创建面包屑。
使用 Bootstrap 创建面包屑
breadcrumb 是一种导航方案，用于在网站或应用程序中向用户指示当前页面的位置。 面包屑导航可以极大地增强具有大量页面或复杂导航层次结构的网站的可访问性。
您可以使用 Bootstrap 创建静态面包屑布局，只需使用 有序列表 上的类 .breadcrumb，如 在以下示例中演示：
<nav>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Products</a></li>
<li class="breadcrumb-item active">Accessories</li>
</ol>
</nav>— 上面示例的输出将如下所示：
默认的面包屑分隔符是 /。 但是，您可以使用一些自定义 CSS 对其进行更改，例如，如果您想使用 > 作为分隔符，您可以应用以下样式规则：
.breadcrumb-item + .breadcrumb-item::before {
content: ">";
}— 上面示例的输出将如下所示：
Advertisements