html progress 有什么作用？ 如何使用？
当我们在网页上上传一个文件，提交一个表单，观看一段视频等的时候，作为良好的用户体验，我们都需要使用一个进度条来提示用户当前应用的进度。html5为我们提供了一个<progress>元素来显示一个进度条。和其他html5元素一样，<progress>元素能使用css和javascript来增强它的外观和功能。html progress元素属于html5家族。ie10+以及其他流行的浏览器都支持,不同浏览器下的效果不尽相同,无论哪个现代浏览器，只要设置了border或background-color样式，进度条元素就会变成扁平化风格。
基本用法如下: <progress></progress>。
html progress 用法实例(www.169it.com)：
标记“下载进度”：
对象的下载进度：
<progress>
<span id="objprogress">85</span>%
</progress>
<!DOCTYPE HTML>
<html>
<body>
The object's downloading progress:
<progress>
<span id="objprogress">76</span>%
</progress>
</body>
</html>
html progress 用法实例实例1
标记"下载进度"：
<progress value="22" max="100"></progress>
浏览器支持
IE 10、Firefox、Opera、Chrome 和 Safari 6 支持 <progress> 标签。
注释：IE 9 或者更早版本的 IE 浏览器不支持 <progress> 标签。
标签定义及使用说明
<progress> 标签定义运行中的任务进度（进程）。
如何自定义progress样式?
<progress>元素在页面上具有默认的尺寸大小，我们可以通过width和height属性来改变它的默认大小：
progress { width: 500px; height: 12px; }
<progress>元素也可以垂直显示。要实现这种效果的最好的方法是使用css transform。另外非常重要的一点是要使用css box-sizing: border-box来重置它的盒模型。mozilla和webkit你好的浏览器在显示<progress>元素的外观和尺寸上略有不同。
HTML 4.01 与 HTML5之间的差异
<progress> 标签是 HTML5 中的新标签。
提示和注释
提示：请将 <progress> 标签与 JavaScript 一起使用来显示任务的进度。
注释：<progress> 标签不适合用来表示度量衡（例如，磁盘空间使用情况或相关的查询结果）。表示度量衡，请使用<meter> 标签代替。
New：HTML5 中的新属性。
| 属性 | 值 | 描述 |
|---|
| maxNew | number | 规定需要完成的值。 |
| valueNew | number | 规定进程的当前值。 |
<progress> 标签支持 HTML 的全局属性。
<progress> 标签支持 HTML 的事件属性。
progress元素和meter元素的区别
<progress>元素和<meter>元素经常会被混淆。它们之间的区别主要有以下两点：
<progress>元素用于显示某个特定任务的时间进度。这个任务的时间上限是可以确定的值，如播放一段音乐的时间；或者是不可确定的值，如上传一个文件到服务器上。<progress>元素的最大值在元素显示时可能是不确定的。例如，完成一个表单提交所需要的进度条。
<meter>元素的不同之处在于，它的最小值和最大值必须是确定的。
另外一个区别是，<progress>元素的最小值可以是0。而<meter>元素的最小值必须是一个浮点数，包括负数，可以想象一下温度计的刻度。
