Bootstrap进度条使用方法前端

佚站网址：http://www.yeahzan.com/course/122-bs-20.html
1、Bootstrap进度条默认样式定义一个进度条的，需要分两个结构进行，第一个是父容器，第二个是进度条，所以类似编码如下：外层的div作为整个进度条的容器，引入样式progress，内部的div作为进度条整体结构，引入样式progress-bar，从而显示当前进度。

2、Bootstrap进度条其他样式
与按钮元素等样式相同，Bootstrap进度条同样提供了其他颜色的样式进行调用，对应颜色也分别有绿色、蓝色、橙色以及红色。
例如需要调用绿色的进度条样式，那么编码如下：需要将对应的颜色样式引入到容器内的div中，且需要与progress-bar同时引用，这几个颜色的样式分别为：
Progress-bar-success、Progress-bar-info、progress-bar-warning以及progress-bar-danger。
3、Bootstrap进度条条纹样式采用条纹样式的进度条，只需要在父容器中加入progress-striped样式即可，例如：以上代码就是定义了绿色条纹进度条。
4、在表格中加入进度条

echo ""; echo ' '; echo "";

5、进度条中显示文字，并且文字的位置控制：

$health= $up/$amount_each*100; echo ""; if( $health < 50 ) { echo "$health% "; } else if( $health < 100 ) { echo " $health% "; } else { echo " $health% "; } echo "";

注意style='width: $health%' 控制进度条宽度。 【Bootstrap进度条使用方法】在不同的的文字会显示在不同地方。