新语义标签

对页面的不同部分增加了一些新语义标签

*   <article>          <!--定义文章-->
*   <aside>           <!--定义页面内容以外的内容-->
*   <details>         <!--定义用户能够查看或者隐藏的细节-->
*   <figcaption>       <!--定义 <figure> 元素的标题-->
*   <figure>          <!--定义自包含内容，如图示、图表、照片、代码清单等-->
*   <footer>          <!--定义文档或节的页脚-->
*   <header>        <!--定义文档或节的页眉-->
*   <main>           <!--定义文档的主内容-->
*   <mark>           <!--定义重要或强调的文本-->
*   <nav>              <!--定义导航链接-->
*   <section>        <!--定义文档中的节（节是有主题的内容组，通常有标题）-->
*   <summary>          <!--定义 <details> 元素的可见标题-->
*   <time>             <!--定义日期或时间-->

新表单

新表单类型

*   email        <!--只能输入email格式，自动带有验证功能 -->
*   tel          <!--手机号码-->
*   url          <!--只能输入url 格式-->
*   number        <!--只能输入数字-->
*   search         <!--搜索框-->
*   range           <!--滑动条-->
*   color        <!--拾色器-->
*   time           <!--时间-->
*   date           <!--日期-->
*   --datetime    <!--时间日期-->
*   month           <!--月份-->
*   week          <!--星期-->

新表单元素（标签）

`<datalist>` 数据列表

可以为 input 输入框添加自动提示

eg.

<input type="text" list="myData"> <!--把 input 中的 list 属性与 datalist 进行绑定-->
    <datalist id="myData">
        <option>本科</option>
        <option>研究生</option>
        <option>不明</option>
    </datalist>

效果如下：

新表单属性

*  placeholder         <!--占位符（提示文字）-->
*  autofocus         <!--自动获取焦点-->
*  multiple         <!--文件上传多选或多个邮箱地址-->
*  autocomplete         <!--自动完成（填充的）。on 开启（默认），off 取消。用于表单元     素，也可用于表单自身(on/off)-->
*  form         <!--指定表单项属于哪个form，处理复杂表单时会需要-->
*  novalidate         <!--关闭默认的验证功能（只能加给form）-->
*  required         <!--表示必填项-->
*  pattern         <!--自定义正则，验证表单-->

多媒体

音频 `<audio>`

1	<audio src="music/yinyue.mp3" autoplay controls> </audio>

*  autoplay          <!--自动播放，写成 autoplay 或者 autoplay = ""，都可以-->
*  controls          <!--控制条（建议把这个选项写上，不然都看不到控件在哪里）-->
*  loop          <!--循环播放-->
*  preload          <!--预加载 同时设置 autoplay 时，此属性将失效-->

音频格式的兼容性写法

<audio controls loop>
    <source src="music/yinyue.mp3"/>
    <source src="music/yinyue.ogg"/>
    <source src="music/yinyue.wav"/>
    抱歉，你的浏览器暂不支持此音频格式
</audio>

视频 `<video>`

1	<video src="video/movie.mp4" controls autoplay></video>

*  autoplay          <!--自动播放，写成 autoplay 或者 autoplay = ""，都可以-->
*  controls          <!--控制条（建议把这个选项写上，不然都看不到控件在哪里）-->
*  loop          <!--循环播放-->
*  preload          <!--预加载 同时设置 autoplay 时，此属性将失效-->
*  width          <!--设置播放窗口宽度-->
*  height          <!--设置播放窗口的高度-->

视频格式的兼容性写法

<video controls autoplay>
    <source src="video/movie.mp4"/>
    <source src="video/movie.ogg"/>
    <source src="video/movie.webm"/>
    抱歉，不支持此视频
</video>