状态标签
很少用到，一般都自定义
meter
-
用来显示已知范围的标量值或者分数值
-
属性值：
- value：当前的数值；
- min：值域的最小边界值，如果设置了，它必须比最大值要小，如果没设置，默认为 0；
- max：值域的上限边界值，如果设置了，它必须比最小值要大，如果没设置，默认为 1；
- low：定义了低值区间的上限值,如果设置了，它必须比最小值属性大，并且不能超过 high 值和最大值，未设置或者比最小值还要小时，其值即为最小值；
- high：定义了高值区间的下限值，如果设置了，它必须小于最大值，同时必须大于 low 值和最小值，如果没有设置，或者比最大值还大，其值即为最大值；
- optimum：这个属性用来指示最优/最佳取值；
-
示例代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <meter value="60" min="20" max="100"></meter> <meter value="80" min="20" max="100" low="40" high="60"></meter> <meter value="30" min="20" max="100" low="40" high="60" optimum="80"></meter> </body> </html> -
效果展示：
progress
-
用来显示一项任务的完成进度
-
属性值：
- max：该属性描述了这个 progress 元素所表示的任务一共需要完成多少工作；
- value：该属性用来指定该进度条已完成的工作量，如果没有 value 属性,则该进度条的进度为"不确定",也就是说进度条不会显示任何进度，你无法估计当前的工作会在何时完成；
-
示例代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <progress value="50" max="100"></progress> <progress max="100"></progress> </body> </html> -
效果展示：
列表标签
datalist
-
包含一组 option 元素，这些元素表示其表单控件的可选值，它的 id 必须要和 input 中的 list 一致
-
示例代码：
<body> <input type="text" placeholder="你的爱好是什么？" list="zdy"></input> <datalist id="zdy"> <option>唱歌</option> <option>打球</option> <option>健身</option> <option>跑步</option> </datalist> </body> -
效果展示：
details
-
一个 ui 小部件，用户可以从其中检索附加信息；
- open 属性来控制附加信息的显示与隐藏；
- summary:用作 一个
<details>元素的一个内容摘要（标题）；
-
示例代码：
<body> <details> <summary>你的爱好是什么</summary> <p>健身</p> <p>健身</p> <p>健身</p> </details> </body> -
效果展示：
你的爱好是什么
健身
健身
健身
打赏作者
您的打赏是我前进的动力
微信
支付宝
🏷 语义化标签
上一篇
评论
