<meter>
标签属性
用于表示测量值的范围(如磁盘空间、评分、温度计等),不强调动态进度,而是展示数值在某个区间内的位置。
属性 | 类型 | 必须 | 说明 | 示例值 |
---|---|---|---|---|
value |
number | 是 | 当前测量值(0 ≤ value ≤ max ) |
value="45" |
max |
number | 是 | 最大值(默认 100 ) |
max="100" |
min |
number | 否 | 最小值(默认 0 ) |
min="0" |
low |
number | 否 | 低值阈值(min ≤ low ≤ high ≤ max ) |
low="30" |
high |
number | 否 | 高值阈值(默认 max ) |
high="80" |
optimum |
number | 否 | 最佳值(仅在 low 和 high 存在时生效) |
optimum="60" |
aria-* |
ARIA 属性 | 否 | 提升可访问性(如 aria-label 、aria-labelledby ) |
aria-label="磁盘使用率" |
<!-- 磁盘使用率(带阈值区间) -->
<meter
value="65"
min="0"
max="100"
low="20"
high="80"
optimum="70"
>
65% / 100GB
</meter>
<!-- 温度计(带单位) -->
<meter
value="22"
min="0"
max="40"
lang="zh-CN"
>
22°C
</meter>
<progress>
标签属性
用于表示任务进度(如文件下载、上传、加载过程),强调动态更新,通常带动画效果。
属性 | 类型 | 必须 | 说明 | 示例值 |
---|---|---|---|---|
value |
number | 否 | 当前进度值(0 ≤ value ≤ max ,默认 0 ) |
value="50" |
max |
number | 是 | 最大值(默认 100 ) |
max="100" |
indeterminate |
boolean | 否 | 是否显示不确定的进度(如未知剩余时间的任务) | indeterminate |
aria-* |
ARIA 属性 | 否 | 提升可访问性(如 aria-label 、aria-labelledby ) |
aria-label="上传进度" |
<!-- 下载进度(