面包屑(Breadcrumb)

优质
小牛编辑
125浏览
2023-12-01

面包屑是显示网站基于层次结构的信息的好方法。 对于博客,面包屑可以显示发布日期,类别或标签。 它们指示当前页面在导航层次结构中的位置。

Bootstrap中的面包屑只是一个带有.breadcrumb类的无序列表。 CSS(bootstrap.min.css)通过以下类自动添加分隔符 -

.breadcrumb > li + li:before {
   color: #CCCCCC;
   content: "/ ";
   padding: 0 5px;
}

以下示例演示了面包屑 -

<ol class = "breadcrumb">
   <li><a href = "#">Home</a></li>
   <li><a href = "#">2013</a></li>
   <li class = "active">November</li>
</ol>