English 中文(简体)
Bootstrap Tutorial

Bootstrap with CSS

Bootstrap Layout Components

Bootstrap Plugins

Bootstrap Demos

Bootstrap Useful Resources

Selected Reading

Bootstrap - Breadcrumb
  • 时间:2024-11-03

Bootstrap - Breadcrumb


Previous Page Next Page  

Breadcrumbs are a great way to show hierarchy-based information for a site. In the case of blogs, breadcrumbs can show the dates of pubpshing, categories, or tags. They indicate the current page s location within a navigational hierarchy.

A breadcrumb in Bootstrap is simply an unordered pst with a class of .breadcrumb. The separator is automatically added by CSS (bootstrap.min.css) through the following class −

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

The following example demonstrates breadcrumbs −

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