交互元素
文章目录
第1关：交互元素相关概念
相关知识
progress元素
progress元素属于状态交互元素。用来表示页面中的某个任务完成的进度。progress元素具有max和value两个属性：
- max:表示任务的总量，默认值为1.
- value:表示已完成任务的数量。
应用中，可以有以下三种情况。 用法示例1： <progress max=100 value=20></progress> 用法示例2： <progress value=0.5></progress> 用法示例3： <progress></progress> 示例2中，没有设置max属性，则默认为1；示例3中max和value的属性都没有设置，则进度条处于左右自由滑动状态。 当进度条需要动态改变时，需要通过JavaScript来实现。
meter元素
meter元素属于状态交互元素。可用于投票系统中候选人各占比例情况、考试分数统计等。 meter元素具有如下属性：
- form：规定meter元素所属的一个或多个表单，其取值为表单标签form所定义的id名。
- value：设置或获取meter元素的当前值，其数值必须介于min和max值之间。
- max:设置meter元素的最大值，默认为1.
- min:设置meter元素的最小值，默认为0.
- high:设置过高的阈值，当value值大于high并小于max时，显示过高的颜色。
- low：设置过低的阈值，当value值小于low并大于min时，显示过低的颜色。
- optimum:设置最优值。
用法示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<meter></meter>没有属性的meter<br/>
<meter value="0.6"></meter>只有value属性的meter<br/>
<meter value="40" min="10" low="30" high="80" max="100" ></meter>value介于low和high之间，计量条绿色<br/>
<meter value="20" min="10" low="30" high="80" max="100" ></meter>value小于low的meter，计量条黄色<br/>
<meter value="90" min=
最低0.47元/天 解锁文章
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
