html5基础---新增标签

1. 状态标签

· meter: 用来显示已知范围的标量值或者分数值

​ value:当前的数值。
​ min:值域的最小边界值。如果设置了，它必须比最大值要小。如果没设置，默认为0
​ max:值域的上限边界值。如果设置了，它必须比最小值要大。如果没设置，默认为1
​ low:定义了低值区间的上限值,如果设置了，它必须比最小值属性大，并且不能超过high值和最大值。未设置或者比最小值还要小时，其值即为最小值。
​ high:定义了高值区间的下限值。如果设置了，它必须小于最大值，同时必须大于low值和最小值。如果没有设置，或者比最大值还大，其值即为最大值。
​ optimum:这个属性用来指示最优/最佳取值。

· progress:用来显示一项任务的完成进度

​ max:该属性描述了这个progress元素所表示的任务一共需要完成多少工作.
​ value:该属性用来指定该进度条已完成的工作量.
​ 如果没有value属性，进度条会一直滚动。

2. 列表标签

· datalist

​ <datalist>会包含一组option元素，这些元素表示其表单控件的可选值
​ 它的id必须要和input中的list一致

<input type="text" placeholder="你最喜欢的女明星是？" list="zdy"></input>
<datalist id="zdy">
    <option value="1">10岁的周冬雨</option>
    <option value="2">20岁的周冬雨</option>
    <option value="3">30岁的周冬雨</option>
    <option value="4">40岁的周冬雨</option>
</datalist>

· details: 一个ui小部件，用户可以从其中检索附加信息。

​ open属性来控制附加信息的显示与隐藏
​ <summary>:用作 一个<details>元素的一个内容摘要（标题），不写则显示“详细信息”。

尚硅谷男生张晓飞

一个神一样的男人

一个神一样的男人

一个神一样的男人

<details open>
    <summary>尚硅谷男生张晓飞</summary>
    <p>一个神一样的男人</p>
    <p>一个神一样的男人</p>
    <p>一个神一样的男人</p>
</details>

3. 注释标签

​ ruby> <rt>: 展示文字注音或字符注释。

​ 澧li晓飞张澧li晓飞张

<span><ruby>澧<rt>li</rt>晓飞张</ruby></span>

4. 标记标签

​ <mark>:标记出现黄色底色。可用于SEO优化

​ 晓飞同志是在世纪佳缘注册过的会员，他美丽的老婆就是来自于世纪佳缘

<span>晓飞同志是在<mark>世纪佳缘</mark>注册过的会员，他美丽的老婆就是来自于世纪佳缘</span>