<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="0"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 0%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="25"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 25%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="50"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 50%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="75"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 75%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="100"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 100%"></div>
</div><div class="progress" role="progressbar" aria-label="Example with label" aria-valuenow="25"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar" style="width: 25%">25%</div>
</div>
<div class="progress" role="progressbar" aria-label="Example with label" aria-valuenow="10"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar overflow-visible " style="width: 10%">Long label text for the progress bar, set to
a dark color</div>
</div><div class="progress" role="progressbar" aria-label="Example 1px high" aria-valuenow="25"
aria-valuemin="0"
aria-valuemax="100"
style="height: 1px">
<div class="progress-bar" style="width: 25%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Example 20px high" aria-valuenow="25"
aria-valuemin="0"
aria-valuemax="100"
style="height: 20px">
<div class="progress-bar" style="width: 25%"></div>
</div><div class="progress" role="progressbar" aria-label="Success example" aria-valuenow="25"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar bg-success" style="width: 25%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Info example" aria-valuenow="50"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar bg-info" style="width: 50%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Warning example" aria-valuenow="75"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar bg-warning" style="width: 75%"></div>
</div>
<div class="progress" role="progressbar" aria-label="Danger example" aria-valuenow="100"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar bg-danger" style="width: 100%"></div>
</div>