progress标签：
从名字上来看，估计大家也能猜到这个标签是什么标签了，没错，他是一个进度条。在HTML5中我们终于可以不用模拟了。

  1. <progress id="W3Cfuns_progress" max="100"></progress>

复制代码

progress属性：
value：表示当前进度
max：表示总进度
注：value和max属性的值必须大于0，value的值小于或等于max属性的值。

案例：

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>HTML5每日一练progress标签的应用</title>
  6. </head>
  7. <body>
  8. <h1>W3Cfuns-HTML5每日一练progress标签的应用</h1>
  9. <p>完成百分比：<progress id="W3Cfuns_progress" max="100"></progress></p>
  10. </body>
  11. </html>

HTML5每日一练之progress标签的应用的更多相关文章

  1. HTML5每日一练之视频标签的应用

    与音频一样,在过去,我们如果想在Web上播放视频,也是都是通过Flash来播放,同样并不是所有的浏览器都安装了Flash播放器插件,而现在我们在HTML5中,就能完全脱离Flash或其他的插件来播放视 ...

  2. HTML5每日一练之figure新标签的应用

    igure元素是一种元素的组合,可带有标题(可选).figure标签用来表示网页上一块独立的内容,将其从网页上移除后不会对网页上的其他内容产生影响.figure所表示的内容可以是图片.统计图或代码示例 ...

  3. HTML5每日一练之details展开收缩标签的应用

    details标签的出现,为我们带来了更好的用户体验,不必为这种收缩展开的效果再编写JS来实现.注:目前仅Chrome支持此标签. details有一个新增加的子标签——summary,当鼠标点击su ...

  4. HTML5每日一练之input新增加的5种其他类型1种标签应用

    今天介绍input在HTML5中的最后5种类型,分别是:number,range,search,tel和color 注意:此种类型的input在Opera10+中效果为佳,Chrome中效果不是十分好 ...

  5. HTML5每日一练之OL列表的改良

    在HTML5中的OL被改良了,为它增加了两个新属性. start属性:start属性用来定义列表编号的起始位置,比如下面的代码,列表将从50开始51...55以此类推 <ol start=&qu ...

  6. HTML5每日一练之input新增加的六种时间类型应用

    今天介绍一下input在HTML5中新增加的时间类型的应用,与昨天的练习一样,如果在以下这几种输入框中输入的格式不正确,也是无法提交的. 注意:此种类型的input在Opera10+中效果为佳,Chr ...

  7. HTML5每日一练之input新增加的URL类型与email类型应用

    1.URL类型: <form> <input name="urls" type="url" value="http://www.w3 ...

  8. JavaScript----Js操控-HTML5 <progress> 标签

    Js操控----HTML5 <progress> 标签 简单模拟下下载进度跑条 <h4>加载进度</h4> <input type="button& ...

  9. JavaScript学习笔记-Js操控HTML5 <progress> 标签

    Js操控----HTML5 <progress> 标签 简单模拟下下载进度跑条 <h4>加载进度</h4> <input type="button& ...

随机推荐

  1. JavaScript高级程序设计之数据类型

    首先讲讲关于js文件放置的问题,如果把<script>放在head标签处,浏览器会先加载完该处的所有不使用defer属性的js文件再呈现页面的内容(浏览器在遇到body标签时才呈现内容), ...

  2. NPOI导出Excel表功能实现(多个工作簿)(备用）

    Excel生成操作类: 代码 using System; using System.Collections.Generic; using System.Text; using System.IO; u ...

  3. 51nod1244 莫比乌斯函数之和

    推公式.f[n]=1-∑f[n/i](i=2...n).然后递归+记忆化搜索.yyl说这叫杜教筛?时间复杂度貌似是O(n 2/3)的? #include<cstdio> #include& ...

  4. JavaScript——关于字符串的replace函数中的function函数的参数

    <!DOCTYPE> <html> <head> </head> <body> <script type="text/jav ...

  5. linux系统查看磁盘分区使用空间

    Df命令是linux系统以磁盘分区使用空间:df -hl

  6. HDU pog loves szh II (数的处理)

    题意: 给一个序列,找出两个数字a和b(可以相等但不可相同),要求(a+b)%p的结果最大. 思路: 先将所有元素模p,再排序.要找出a和b,分两种情况,a+b>p和a+b<p.第一种,肯 ...

  7. Myeclipse 安装Aptana3.2 插件

    转自(http://www.cnblogs.com/yinger/archive/2011/08/29/2157193.html) 安装步骤: 1.下载aptana3.2 Eclipse Plugin ...

  8. 【原创】搭建Nginx（负载均衡）+Redis（Session共享）+Tomcat集群

    为什么移除首页?哪里不符合要求?倒是回我邮件啊! 一.环境搭建 Linux下Vagrant搭建Tomcat7.Java7 二.Nginx的安装配置与测试 *虚拟机下转至root sudo -i 1)下 ...

  9. NetBeansRCP-添加／修改NetBeans的JVM启动参数

    NetBeans运行的速度实在是不敢恭维.还好机器配置还可以,修改其JVM启动参数命令行,以期运行的更加顺畅. 那么如何修改NetBeans IDE的JVM参数呢? 1.到NetBeans IDE的安 ...

  10. Golang 绘图技术（image/draw包介绍）

          image/draw 包仅仅定义了一个操作:通过可选的蒙版图(mask image),把一个原始图片绘制到目标图片上,这个操作是出奇的灵活,可以优雅和高效的执行很多常见的图像处理任务. 1 ...