其实进度条需要注意的几点:

1、横竖 or

2、样式:progress-bar-success

3、宽度:progress-sm

4、动态效果:active

<divclass="boxbox-solid"><divclass="box-headerwith-border"><h4class="box-title">ProgressBarsDifferentSizes</h4></div><!--/.box-header--><divclass="box-bodytext-center"><p><code>.progress</code></p><divclass="progress"><divclass="progress-barprogress-bar-primaryprogress-bar-striped"role="progressbar"aria-valuenow="40"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">40%Complete(success)</span></div></div><p>Class:<code>.sm</code></p><divclass="progressprogress-smactive"><divclass="progress-barprogress-bar-successprogress-bar-striped"role="progressbar"aria-valuenow="20"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">20%Complete</span></div></div><p>Class:<code>.xs</code></p><divclass="progressprogress-xs"><divclass="progress-barprogress-bar-warningprogress-bar-striped"role="progressbar"aria-valuenow="60"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">60%Complete(warning)</span></div></div><p>Class:<code>.xxs</code></p><divclass="progressverticalprogress-xxs"><divclass="progress-barprogress-bar-dangerprogress-bar-striped"role="progressbar"aria-valuenow="60"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">60%Complete(warning)</span></div></div><divclass="progressverticalactive"><divclass="progress-barprogress-bar-primaryprogress-bar-striped"role="progressbar"aria-valuenow="40"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">40%</span></div></div><divclass="progressverticalprogress-sm"><divclass="progress-barprogress-bar-success"role="progressbar"aria-valuenow="20"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">100%</span></div></div><divclass="progressverticalprogress-xs"><divclass="progress-barprogress-bar-warningprogress-bar-striped"role="progressbar"aria-valuenow="60"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">60%</span></div></div><divclass="progressverticalprogress-xxs"><divclass="progress-barprogress-bar-infoprogress-bar-striped"role="progressbar"aria-valuenow="60"aria-valuemin="0"aria-valuemax="100"><spanclass="sr-only">60%</span></div></div></div><!--/.box-body--></div>