三、交互元素
HTML5是一这些独立特性的集合，它不仅新增了许多Web页面特征，而且本身也是一个应用程序。对于应用程序而言，表现最为突出的就是交互操作。HTML5为操作新增了对应的交互体验元素，如progress、details、summary、menu、command等，这些元素可以在不请求服务器任何资源的情况下 ，改变用户选择的内容与展现状态。通过这些交互元素，更好地改善了HTML5页面的用户体验和功能。
1.progress元素
progress元素属于状态交互元素。所谓状态交互元素，表示页面在与用户进行数据交互时，为了增强用户的UI体验，显示页面中的各种进度状态。
progress元素用来表示页面中的某个事物完成的进度。如下载文件时，可以通过该元素动态展示下载的进度。显示的方式可以使用整数（如1-100），也可以使用百分比（如1%到100%）。
<progress value="当前进度值" max="最大值">
<>progress元素的属性及描述
属性 | 值 | 描述 |
max | number | 规定任务一共需要多少工作 |
value | number | 规定已完成多少任务 |
progress元素中设置的value值必须小于或等于max属性值，且两者都必须大于0。
<html>
<body>
下载进度
<progress value="22" max="100">
</progress>
<p><b>注释：</b>Internet Explorer 9 以及更早的版本不支持progress标签。<p>
</body>
<html>
2.meter元素
meter元素是HTML5中新增的标签，用于表示在一定数量范围中的值，也属于状态交互元素。
可用于投票系统中候选人各占比例情况及考试分数统计等。
meter元素仅帮助浏览器识别HTML中的数量，而不对该数量做任务格式修饰。
<meter value="当前度量值" min="最小值" max="最大值">meter元素的属性及描述。
属性 | 值 | 描述 |
form | form_id | 规定meter元素所属的一个或多个表单 |
high | number | 规定被视作高的值的范围 |
low | number | 规定被视作低的值的范围 |
max | number | 规定范围的最大值 |
min | number | 规定范围的最小值 |
optimum | number | 规定度量的优化值 |
value | number | 必须。规定度量的当前值 |
<!DOCYPE html>
<html>
<body>
<p>显示度量值：</p>
<meter value="35" min="0" max="100">35/100</meter>
<meter value="0.6">60%</meter>
<p>Internet Explorer 不支持 meter 标签。</p>
</body>
</html>
