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. SQL多表联合分页.....

    set ANSI_NULLS ON set QUOTED_IDENTIFIER ON go /* 支持多表查询分页存储过程(事理改进)2012.3 --多表联查1 declare @Count int ...

  2. UVa 10106 Product

    高精度乘法问题,WA了两次是因为没有考虑结果为0的情况.  Product  The Problem The problem is to multiply two integers X, Y. (0& ...

  3. 精选37条强大的常用linux shell命令组合

    任务                             命令组合 1 删除0字节文件 find . -type f -size 0 -exec rm -rf {} \;find . type f ...

  4. NSThread小笔记

    接口 Initializing an NSThread Object – init – initWithTarget:selector:object: Starting a Thread + deta ...

  5. SQL Server 2008 序列号

    SQL Server 2008 序列号:Developer: PTTFM-X467G-P7RH2-3Q6CG-4DMYBEnterprise:   JD8Y6-HQG69-P9H84-XDTPG-34 ...

  6. Apache Conf/Vost/xx.conf 文件配置

    #监听8086端口Listen 8086 NameVirtualHost *:8086#保持绝对一致 <VirtualHost *:> ServerName localhost Serve ...

  7. 統計分析dbms_stats包与analyze 的区别

    Analyze StatementThe ANALYZE statement can be used to gather statistics for a specific table, index ...

  8. eclipse环境下tomcat远程调试方法

    前提:Windows环境tomcat是以catalina.bat方式而非Windows服务形式启动(两者所使用的JAVA配置及JVM参数会有差异). 服务器段设置 方法1:修改CATALINA_OPT ...

  9. Windows下PHP+Eclipse开发环境搭建 及错误解决(apache2.2服务无法启动 发生服务特定错误:1)

    前言 Eclipse与php/apache的关系:Eclipse只是用来写代码的,如果想要在浏览器查看运行效果就要让php/apache的运行目录指向你的代码目录.Eclipse貌似不会自己和apac ...

  10. 【转】WPF MultiBinding 和 IMultiValueConverter

    WPF MultiBinding 和 IMultiValueConverter 时间 2015-02-02 19:43:00  博客园精华区 原文  http://www.cnblogs.com/wo ...