html5里的progress怎么写,HTML5元素progress标签的使用方法及作用

HTML5元素progress标签的使用方法及作用详解如下：

标签的定义

标签定义进度条的，也就是定义任务的进度(进程)，比如下载的进度显示条效果。

标签不适合用来表示度量衡(例如，磁盘空间使用情况)，但表示度量衡，请使用  标签代替。

标签是html5中新增的标签。

浏览器支持情况

标签已被IE10或以上、Firefox、Opera、Chrome 和 Safari6支持。

但 IE 9 或者更早版本的 IE 浏览器不支持标签。

标签的用法

标签是双标签，必须有开始标签和结束标签成对出现。

比如，我们要标记一个任务完成了26%，代码就可以这样写：

以上代码在浏览器中显示的进度条效果如下：

注意：和之间不需要任何元素内容，就算有元素内容也是不可见的。

标签的属性

属性值描述

maxnumber规定需要完成的值。

valuenumber规定进程的当前值。

标签的属性的用法也很简单的，max属性代表整个任务的总数量，而value属性代表任务已经完成了多少数量。

比如，我的总任务数量一共需要完成78件，但我目前已经完成了60件，用标签表示当前完成任务的进度，就可以像下面这样写：

以上代码在浏览器中显示的进度条效果如下：

扩展学习

标签配合JavaScript 一起使用，可以动态的显示任务的进度。

下载

function start_run(n)

{

if(n==0){alert("下载完成")}

var progress1=document.getElementById("progress1")

n=n-1

cur_task=100-n

progress1.value=cur_task

setTimeout("start_run("+n+")",100)

}

以上代码在浏览器中显示效果如下：

如上图所示，点击“下载”按钮后，任务进度条就会动起来！