<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：动画的进度条</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:20px;">

<div class="progress progress-striped active">
<div id="div2" class="progress-bar progress-bar-success" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%" role="progressbar"><span class="sr-only">70%完成(成功)</span></div>
</div>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap历练实例：动画的进度条的更多相关文章

  1. Bootstrap <基础二十六>进度条

    Bootstrap 进度条.在本教程中,你将看到如何使用 Bootstrap 创建加载.重定向或动作状态的进度条. Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果.Internet ...

  2. Bootstrap历练实例：堆叠的进度条

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  3. Bootstrap历练实例：默认的进度条

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  4. Bootstrap历练实例：默认的缩略图

    本章将讲解Bootstrap缩略图,大多数站点都需要要在网格中布局图像,视频,文本.Bootstrap通过缩略图为此提供了一些简便的方法,使用Bootstrap创建缩略图的步骤如下: 1.在图像的周围 ...

  5. 30款基于 jQuery & CSS3 的加载动画和进度条插件

    我们所生活每一天看到的新技术或新设计潮流的兴起,Web 开发正处在上升的时代.HTML5 & CSS3 技术的发展让 Web 端可以实现的功能越来越强大. 加载动画和进度条使网站更具吸引力.该 ...

  6. Bootstrap历练实例：轮播(carousel)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  7. Bootstrap历练实例：响应式导航(带有表单)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. Bootstrap历练实例：响应式导航

    <!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Conten ...

  9. Bootstrap 历练实例-轮播(carousel)插件的事件

    事件 下表列出了轮播(Carousel)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 slide.bs.carousel 当调用 slide 实例方法时立即触发该事件. $(' ...

随机推荐

  1. 2014-10-5 NOIP模拟赛

    祖孙询问 (tree.pas/c/cpp) [问题描述] 已知一棵n个节点的有根树.有m个询问.每个询问给出了一对节点的编号x和y,询问x与y的祖孙关系. [输入格式] 输入第一行包括一个整数n表示节 ...

  2. 记录错误:tomcat“socket close”错误

    Error running 'Tomcat 8.5.37': Unable to open debugger port (127.0.0.1:9562) 使用打开cmd.exe 输入 1)taskli ...

  3. 脑图和MarkDown

    使用脑图整理前端体系 根据以下网址整理 http://web.jobbole.com/84062/ http://naotu.baidu.com/ 学习MarkDown语法格式 (一) 标题 在首行插 ...

  4. SpringBoot（1）—启动原理之SpringApplication对象的创建

    创建SpringApplication对象 SpringBoot版本为 2.1.1.RELEASE @SpringBootApplication public class SpringbootDemo ...

  5. Mac用brew安装MySQL

    1.先安装brew 网址:https://brew.sh/ 复制命令:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent ...

  6. python数值类型与序列类型

    基本运算符 / 浮点除法 //整除 x**y  x的y次方 python中严格区分大小写 type(xx)/内置函数,查看变量xx的类型 id(xx)/内置函数,查看变量xx的内存地址 //----- ...

  7. BZOJ 1036 && Luogu P2590 [ZJOI2008]树的统计 树链剖分

    链剖裸题...你值得一做~ 用线段树多维护一个mx,少写一个tag #include<cstdio> #include<iostream> #define ll long lo ...

  8. 开园了，将以此记录个人web前端之路

    记录.分享与学习 2015年5月中旬开始学习web前端到2015年6月底找到第一份相关工作,在学习与工作过程中通过网络获益良多,在此写下个人学习与工作过程中的总结与思考,记录个人成长,同时也希望能够帮 ...

  9. 洛谷P1781 宇宙总统

    https://www.luogu.org/problem/show?pid=1781 高精比较大小: #include<iostream> #include<cstdio> ...

  10. js正则匹配获取文件名

    //获取文件名,不带后缀 var file_name=file_path.replace(/(.*\/)*([^.]+).*/ig,"$2"); //获取文件后缀 1.var Fi ...