Progress Bars
Size Options
Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">
Bootstrap
<span class="pull-right">92%</span>
</h3>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-primary"
role="progressbar" aria-valuenow="92"
aria-valuemin="0" aria-valuemax="100"
style="width: 92%">
</div>
</div>
Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">
Bootstrap
<span class="pull-right">92%</span>
</h3>
<div class="progress progress-xs">
<div class="progress-bar progress-bar-primary"
role="progressbar" aria-valuenow="92"
aria-valuemin="0" aria-valuemax="100"
style="width: 92%">
</div>
</div>
Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">
Bootstrap
<span class="pull-right">92%</span>
</h3>
<div class="progress progress-sm">
<div class="progress-bar progress-bar-primary"
role="progressbar" aria-valuenow="92"
aria-valuemin="0" aria-valuemax="100"
style="width: 92%">
</div>
</div>
Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">
Bootstrap
<span class="pull-right">92%</span>
</h3>
<div class="progress">
<div class="progress-bar progress-bar-primary"
role="progressbar" aria-valuenow="92"
aria-valuemin="0" aria-valuemax="100"
style="width: 92%">
</div>
</div>
Color Options
Red 92%
Blue 68%
Green 78%
Aqua 78%
Yellow 92%
Brown 68%
Violet 78%
Orange 78%
Default Progress Bar
<div class="progress">
<div class="progress-bar progress-bar-success"
role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100"
style="width: 90%;">
</div>
</div>
Striped Progress Bar
<div class="progress progress-striped">
<div class="progress-bar progress-bar-success"
role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100"
style="width: 90%;">
</div>
</div>
Animated Progress Bar
<div class="progress progress-striped active">
<div class="progress-bar progress-bar-success"
role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100"
style="width: 90%;">
</div>
</div>
Stacked Progress Bar
<div class="progress">
<div class="progress-bar progress-bar-success"
role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100"
style="width: 90%;">
</div>
<div class="progress-bar progress-bar-info"
role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100"
style="width: 30%;">
</div>
</div>
