Components
Pagination
Provide pagination links for your site or app with the multi-page pagination component.
Default pagination
Simple pagination inspired by Rdio, great for apps and search results. The large block is hard to miss, easily scalable, and provides large click areas.
Pagination Sizing
Fancy larger or smaller pagination? Add .pagination-lg or .pagination-sm for additional sizes.
Pager
Quick previous and next links for simple pagination implementations with light markup and styles. It's great for simple sites like blogs or magazines.
Breadcrumbs
Indicate the current page's location within a navigational hierarchy.
Default Breadcrumbs (Transparent)
Breadcrumbs Variations
Example
Labels & Badges
Labels
Add any of the below mentioned modifier classes to change the appearance of a label.
Badges
Easily highlight new or unread items by adding a <span class="badge"> to links, Bootstrap navs, and more.
Badges example
Progress
Provide up-to-date feedback on the progress of a workflow or action with simple yet flexible progress bars.
Basic Progress Bars
Default progress bar. Progress bars use some of the same button and alert classes for consistent styles.
Progress Bar with Label
Progress Bar Sizes
Fancy larger or smaller progress bar? Add .progress-lg, .progress-sm, .progress-xs, or .progress-mini for additional sizes.
Stripped Progress Bars
Uses a gradient to create a striped effect. Not available in IE8.
Animated Progress Bars
Add .active to .progress-striped to animate the stripes right to left. Not available in IE9 and below.
Stacked Progress Bars
Place multiple bars into the same .progress to stack them.