菜鸟高飞路之HTML5的新特性

这些新特性都有兼容性问题，基本上是IE9+以上版本的浏览器才支持，如果不考虑兼容性问题，可以大量使用这些新特性

一、新增语义化标签

<header> ：头部标签

<nav> ：导航标签

<article> ：内容标签

<section> ：定义文档某个区域

<aside> ：侧边栏标签

<footer> ：尾部标签

二、新增的多媒体标签

使用它们可以很方便的在页面中嵌入音频和视频，而不再去使用flash和其他浏览器插件

1.视频 <video>

当前<video>元素支持三种视频格式：mp4、webm、ogg （尽量使用mp4）

1.语法：

<video src="文件地址" controls>
</video>

<video controls>
    <source src="1.mp4"></source>
    <source src="1.ogg"></source>
</video>

<video> ：视频标签

<source> ：<source>标签为媒体元素定义媒体资源，<source>标签允许规定两个视频/音频文件供浏览器根据它对媒体类型或者编解码器的支持进行选择。

2.视频<video>常见属性

2.音频 <audio>

当前<audio>元素支持三种音频格式：mp3、wav、ogg（尽量使用mp3）

语法：

<audio src="文件地址" controls>
</audio>

<audio controls>
    <source src="1.mp3"></source>
    <source src="1.ogg"></source>
</audio>

音频标签和视频标签使用方式基本一致

三、新增的input类型

四、新增的表单属性

 1.required属性

值：required

说明：表单拥有该属性表示其内容不能为空，必填

2.placeholder属性

值：提示文本

说明：表单的提示信息，存在默认值将不显示

 3.autofocus属性

值：autofocus

说明：自动聚焦属性，页面加载完成自动居家到指定表单

 4.disabled属性

值：disabled

说明：禁用表单属性

5.autocomplete属性 

 值：off/on

说明：自动补全属性，默认已经打开，还要配合name属性实现，按照name的组名将成功提交的数据存在浏览器中，用提示的方式显示