结构标签相当于为通用块元素/容器 <div> 添加了特定的语义

• <article> 标记一篇文章
• <header> 标记一个页面或区域的头部
• <nav> 标记导航链接
• <section> 标记一个区域
• <aside> 标记页面内容部分的侧边栏
• <hgroup> 标记文件中一个区域的相关信息，一般将标题集包含在内
• <figure> 标记一组媒体内容以及标题 <figcaption>
• <footer> 标记一个页面或一个区域的底部
• <dialog> 标记一个对话框（会话框）

• <video src="source_path"> 标记一个视频
• <audio src="source_path"> 标记音频内容
• <canvas> 标记一张画布
• <embed src="source_path"> 标记外部的可交互的内容或插件，也可以用于引入 SVG 图片

视频和音频多媒体标签一般可以添加多种属性

• 属性 autoplay="autoplay" 可实现自动播放
• 属性 controls 可以在页面显示播放控制按钮
• 属性 width 和 height 设置（视频）多媒体的宽高
• 标签内可以添加内容，以备标签无法识别时作为可替代文字显示出来

<audio>
    <source src="source_path" type="audio/mpeg"/>
</audio>

• <meter> 计量器元素用来可视化显示当前的标量值或分数值（百分比），默认以横向条形「能量槽」显示。一般与元素 <form> 相关联以显示某个数值输入框（<input/> 元素，number 类型）的范围。该元素可以设置多个属性
  • 属性 value 设置当前的数值。如果设置了最小值和最大值（分别由 min 属性和 max 属性定义），它必须介于最小值和最大值之间。如果给定的值不在最小值和最大值之间，它的值就等于它最接近的一端的值。
  • 属性 min 和 max 设置上下边界值
  • 属性 low 和 hiht 定义低值区间和高值区间的界限，如果 value 落入低值区间 [min, low] 或高值区间 [high, max] 浏览器会渲染不同的视觉效果，如 Chrome 渲染出红色
  • 属性 optimum 设置最优值。
  • 属性 form 将该计量器与表单元素关联，只有当计量器元素被用作表单关联的元素时，该属性才应当被使用。
• <progress/> 元素用来显示一项任务的完成进度，默认显示为一个进度条。可以设置两个属性
  • 属性 max 描述了该进程所表示的任务一共需要完成多少工作
  • 属性 value 描述了当前该进度条已完成的工作量，取值范围是 0 到 max（或 0 到 1 如果 max 没有设置）如果没有 value 属性则该进度条的进度为不确定，即无法预计需要多长时间完成任务，会呈现一个进度条动画。

元素 <datalist> 是数据列表元素，结合表单元素 <input/> 可以构建更多功能的下拉表单控件，用以替代 <select> 元素。它的子元素 <option> 设置多个备选项目。

该新增的下拉表单支持用户输入关键字以匹配已有的备选项，也支持用户输入新的值传输给服务器。

<label for="ice-cream-choice">Choose a flavor:</label>
<input list="ice-cream-flavors" id="ice-cream-choice" name="ice-cream-choice" />

<datalist id="ice-cream-flavors">
    <option value="Chocolate">
    <option value="Coconut">
    <option value="Mint">
    <option value="Strawberry">
    <option value="Vanilla">
</datalist>

元素 <details> 可创建一个挂件，它包含的内容只有切换成展开状态时才会显示。其子元素 <summary>可为该部件提供概要描述。

<details>
    <summary>Details</summary>
    Something small enough to escape casual notice.
</details>

元素 <ruby> 为文字添加注释或音标，注音（一般是针对东亚文字）或字符注释默认显示在文字的上方。

<ruby>
  汉 <rp>(</rp><rt>han</rt><rp>)</rp>
  字 <rp>(</rp><rt>zi</rt><rp>)</rp>
</ruby>

需要注释的字/词放在元素 <ruby> 之中，而注释或注音内容紧跟在后用元素 <rt> 包括，而元素 <rp> 可以添加浏览器不识别 <ruby> 标签才显示的内容，一般是为注音添加括号。

元素 <mark> 标记文本，默认样式是黄色背景。

元素 <output> 表示计算输出或用户操作的结果，一般配合 oninput 事件可以实时获得表单输入值的相关计算结果。

<form oninput="result.value=parseInt(a.value)+parseInt(b.value)">
    <input type="range" name="b" value="50" /> +
    <input type="number" name="a" value="10" /> =
    <output name="result"></output>
</form>

表单元素 <input/> 新增了多个类型，即属性 type 新增多个属性值，可用于数据基本验证和提供更好的用户体验

• email 输入值为邮件，对于移动端输入时键盘会提供 @ 符号
• url 输入为链接，对于移动端输入时键盘会提供 @ 符号
• tel 输入为电话号码，对于移动端输入时会切换到数字键盘
• number 输入数值，只能输入 0~9 及常见的运算符号，且输入框右侧有上下按钮可以调整数值大小
• range 输入范围，默认样式是一个滑杆，配合使用属性 min 和 max 设置可选范围（默认是 1~100）
• search 用于搜索域，当输入框有文字输入后，会在最右侧显示一个 x 符号，点击即可快速清空输入内容
• color 创建一个颜色控件，点击该元素会弹出一个拾色器，允许从中选取颜色
• Data Picker 用以输入时间日期，在移动端会调用相应的弹出框选取日期
  • Date 选取日、月、年
  • Month 选取月、年
  • Week 选取周和年（移动端一般不支持）
  • Time 选取时间（小时和分钟）
  • Datetime 选取时间、日、月、年（UTC 时间）（移动端和桌面端一般不支持）
  • Datetime-local 选取时间、日、月、年（本地时间）

• 属性 autocomplete 可以让表单输入框拥有「自动完成」功能，在表单元素 <form> 将该属性设置为 on （默认值）时，可以在输入时出现提示值（类似于下拉菜单，弹出历史记录中输入过的内容），点击备选值可以快速填充表单。
  Tip

  可以针对单个输入框 <input/> 设置属性 autocomplete 修改其自动填充行为，如对于密码框 <input type="password"/> 一般取消自动完成。

• 属性 autofocus 设置页面加载时自动聚焦到此表单控件，在表单输入框元素 <input/> 设置该属性，在页面加载后光标会自动在表单中等待用户直接输入内容，可以优化用户体验。
• 属性 multiple 可以允许输入多个值，适用于 <input type="file"/> 和 <input type="email"/> 类型的表单，如允许同时上传多个文件。
• 属性 placeholder 为输入框提供一种 hint 提示，当输入内容为空时会显示该属性值，以提示用户输入所期待格式的值。适用于元素 <input/> 多种 type 类型，包括 text、search、url、tel、email、password
• 属性 required 是一个布尔值，表示只有当此 <input/> 元素有值时整个表单才能提交，否则会在提交表单时提示用户进行填写。
  该属性适用于输入或选择表单，如元素 <input/> 多种类型，包括 text、search、url、tel、email、password、data pickers、number、checkbox、radio、file 等。

• 属性 sizes 设置图片大小，用于元素 <link rel="icon" href="image_path.png" type="image/png" sizes="16x16"/> 外部链接文件为图片，即为网页设置标签栏图标时，使用 sizes 设置图标的大小（可以设置多个尺寸并用空格分隔，以提供响应式图片源，但源文件中需要有对应尺寸的图片）。
• 属性 target 可以用于元素 <base> 中设置整个网页的默认链接打开方式，如 <base target="_blank"/> 所有链接默认在新窗口中打开
• 超链接 <a> 新增多种属性以优化浏览器
  • 属性 media 设置链接跳转页面所在的设备类型，如 handheld 表示「手持」设备，tv 表示电视设备，浏览器基于该属性可以对网页进行优化更适合相应设备操作
  • 属性 hreflang 设置链接跳转页面的语言，如 hreflang="zh" 表示设置为中文
  • 属性 rel="external" 设置链接为外部链接，为锚标签提供更多的语义

元素 <script> 新增属性以标注脚本的加载顺序和形式，可以优化网页加载提高用户体验度。

• 属性 defer 是一个布尔值，规定当页面结构加载完成后（DOM 文件建立完成，而不是页面渲染完成），脚本才会执行，⚠️ 当在元素 <head> 中引入的脚本需要操作 DOM 对象时，需要进行该属性的设置以对脚本执行进行延迟。
• 属性 async 是一个布尔值，规定脚本一旦可用，则会异步执行脚本（即实现 JavaScript 多线程加载）。

• 属性 start 设置有序列表的序号起始值
• 属性 reserved 是一个布尔值，设置倒序标记列表项，即列表顺序以降序标记

* 属性 manifest="cache_file" 在元素 <html> 中进行设置，以定义页面需要下载的文件（在 cache_file 中定义的文件列表），轻松地创建 Web 应用的离线版本

属性 scoped 用于元素 <style> 中进行设置，以实现 HTML 任何地方中内嵌样式。