Bootstrap基本组件学习笔记之进度条(15)

Bootstrap提供了各式各样的进度条。

看下面的例子：

 
 
 
 
 
 



 

 

 
进度条
 
 

 

 
progress-bar-info(20%)
 
 

 
progress-bar-success(60%)
 
 

 
progress-bar-danger(35%)
 
 

 
progress-bar-warning(90%)
 
 

 
progress-bar-striped(66%)
 
 

 
progress-bar-warning(35%)
 
progress-bar-danger(25%)
 
progress-bar-info(30%)
 
 
 

效果如下：

其中下面的一段产生了动态效果：

 
progress-bar-warning(66%)

下面一段产生了叠加效果：

 
progress-bar-warning(35%)
 
progress-bar-danger(25%)
 
progress-bar-info(30%)

如果大家还想深入学习，可以点击这里进行学习，再为大家附3个精彩的专题：

Bootstrap学习教程

Bootstrap实战教程

Bootstrap插件使用教程

本文系列教程整理到：Bootstrap基础教程 专题中，欢迎点击学习。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。