<!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. 洛谷P3004 [USACO10DEC]宝箱Treasure Chest

    P3004 [USACO10DEC]宝箱Treasure Chest 题目描述 Bessie and Bonnie have found a treasure chest full of marvel ...

  2. 【Ionic+AngularJS 开发】之『个人日常管理』App（一）

      写在前面的话 过去一年自己接触了不少手机前端开发,得益于现在手机性能的提升和4G普及,感觉使用混合技术开发手机App已经可以满足越来越多的应用场景了.新年伊始,对自己2016年所学知识做一个阶段性 ...

  3. SpringMVC之一个简单的例子

    一.一个简单的例子 二.web.xml文件配置 三.spring-mvc.xml文件(等同于struts2的struts文件) 四.login.jsp(登录页面) 五.登录成功的页面(success. ...

  4. C 语言实例 - 求两数的最大公约数

    C 语言实例 - 求两数的最大公约数 用户输入两个数,求这两个数的最大公约数. 实例 - 使用 for 和 if #include <stdio.h> int main() { int n ...

  5. 《SQL 进阶教程》 case:将已有编号方式转换为新的方式并统计

    SQL 权威指南SQL 解惑在进行非定制化统计时,需要将已有编号方式转换为另外一种便于分析的方式进行统计需求 select case when name='哈尔滨' then '黑龙江' when n ...

  6. G.Longest Palindrome Substring

    链接:https://ac.nowcoder.com/acm/contest/908/G 题意: A palindrome is a symmetrical string, that is, a st ...

  7. 前端JavaScript(2) --常用内置对象,函数,伪数组 arguments,关于DOM的事件操作,DOM介绍

    昨日内容回顾 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 ...

  8. Hive_Hive的数据模型_视图

    - 视图是一种虚表,是一个逻辑概念:可以跨越多张表- 视图建立在已有表的基础上,视图赖以建立的这些表称为基表.- 视图可以简化复杂的查询. 创建视图 create view viewName as s ...

  9. guacamole的复制粘贴

    一.发送中文或文本(针对开发环境,生产环境不需变动) 官方下载的完整版js缺失了一部分关于粘贴板的代码,调用setclipboard方法,将外部内容复制到粘贴板的时候,提示方法不存在.需要补齐这部分源 ...

  10. opencv作业

    作业下载地址: 链接:http://pan.baidu.com/s/1qYQnbkw 密码:v7y9