Progress Bars
Progress Bars
Provide up-to-date feedback on the progress of a workflow or action with simple yet flexible progress bars.
Default Progress Bars
Default progress bars are simple and css driven.
Primary with progress-bar-primary class.
Info with progress-bar-info class.
Success with progress-bar-success class.
Warning with progress-bar-warning class.
Danger with progress-bar-danger class.
Inverse with progress-bar-inverse class.
<div class="progress">
<div class="progress-bar progress-bar-primary" style="width: 20%"></div>
</div>
Striped Progress Bars
Sriped Progress bars made with CSS3 gradients, just add the progress-striped class
Note Does not work with browsers that do not support CSS3 gradients or animations, like IE9
Info
Animated Progressbars
Animated progressbars with CSS3, just add a class active with progress-striped
Inverse
Stacking progressbars
You can stack one progressbar on top of another simply by including them all in the same div.progress