# HTML5 新特性
HTML5 的新增特性主要是针对以前的不足，增加了一些新的标签，新的表单和新的表单属性等
这些新特性都有兼容性问题，基本是 IE9 + 以上版本的浏览器才支持，如果不考虑兼容性问题，可以大量使用这些新特性
# 语义化标签
<header>: 头部标签<nav>: 导航标签<article>: 内容标签<section>: 定义文档某个区域<aside>: 侧边栏标签<footer>: 尾部标签
** 注意 : **
- 这种语义化标准主要是针对搜索引擎的
- 这些新标签页面中可以使用多次
- 在 IE9 中，需要把这些元素转换为块级元素
- 移动端更喜欢使用这些标签
# 多媒体标签
新增的多媒体标签主要包含两个 :
- 音频 :
<audio> - 视频 :
<video>
使用它们可以很方便的在页面中嵌入音频和视频，而不再去使用 flash 和其他浏览器插件
语法 :
1 | <video src="文件地址" controls="controls"></video> |
# 视频标签
常见属性 :
| 属性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 视频就绪自动播放 (Chrome 需要添加 muted 来解决自动播放问题) |
| controls | controls | 向用户显示播放控件 |
| width | pixels (像素) | 设置播放器宽度 |
| height | pixels (像素) | 设置播放器高度 |
| loop | loop | 播放完是否继续播放该视频，循环播放 |
| preload | auto (预先加载视频) none (不应加载视频) | 规定是否预加载视频 (如果有了 autoplay, 就忽略该属性) |
| src | url | 视频 url 地址 |
| poster | imgurl | 加载等待的画面图片 |
| muted | muted | 静音播放 |
# 音频标签
| 属性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 如果出现该属性，则音频标签在就绪后马上播放 |
| controls | controls | 如果出现该属性，则向用户显示控件，比如播放按钮 |
| loop | loop | 如果出现该属性，则每当音频结束时重新开始播放 |
| src | url | 要播放的音频的 url |
# 新增的 input 类型
| 属性值 | 说明 |
|---|---|
| type="email" | 限制用户输入必须为 Email 类型 |
| type="url" | 限制用户输入必须为 URL 类型 |
| type="date" | 限制用户输入必须为日期类型 |
| type="time" | 限制用户输入必须为时间类型 |
| type="month" | 限制用户输入必须为月类型 |
| type="week" | 限制用户输入必须为周类型 |
| type="number" | 限制用户输入必须为数字类型 |
| type="tel" | 手机号码 |
| type="search" | 搜索框 |
| type="color" | 生成一个颜色选择表单 |
- 重点记住 : number, tel search 三个
# 新增的表单属性
| 属性 | 值 | 说明 |
|---|---|---|
| required | required | 表单拥有该属性表示其内容不能为空，必填 |
| placeholder | 提示文本 | 表单的提示信息，存在默认值将不显示 |
| autofocus | autofocus | 自动聚焦属性，页面加载完成自动聚焦到指定表单 |
| autocomplete | off / on | 当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选线 默认已经打开，如 autocomplete="on", 关闭 autocomplete="off" 需要放在表单内，同时加上 name 属性，同时成功提交 |
| multiple | multiple | 可以多选文件提交 |
