HTML5
1.什么是HTML5?
HTML5是一个新的网络标准，现在仍处于发展阶段。目标是取代现有的HTML 4.01和XHTML 1.0 标准。它希望能够减少互联网富应用（RIA)对Flash、Silverlight、JavaFX等的依赖，并且提供更多能有效增强网络应用的API。
2.HTML5的发展历程?
图片1.png
3.语义化标签
![Uploading 图片3_292855.jpg . . .]
》》》》》》
图片3.jpg
4.结构性标签
<details>
关于文档的细节：
目前只有 Chrome 和 Safari 6 支持 <details> 标签。
<details>
<summary>Copyright 2011.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
<figure>
标签规定独立的流内容（图像、图表、照片、代码等等）。
figure 元素的内容应该与主内容相关，但如果被删除，则不应对文档流产生影响。
<figure>
<p>黄浦江上的的卢浦大桥</p>
</figure>
用作文档中插图的图像，带有一个标题：
<figure>
<figcaption>黄浦江上的的卢浦大桥</figcaption>
</figure>
<time>
<time> 标签定义公历的时间（24 小时制）或日期，时间和时区偏移是可选的。
该元素能够以机器可读的方式对日期和时间进行编码，这样，举例说，用户代理能够把生日提醒或排定的事件添加到用户日程表中，搜索引擎也能够生成更智能的搜索结果。
<p>我们在每天早上 <time>9:00</time> 开始营业。</p>
<p>我在 <time datetime="2008-02-14">情人节</time> 有个约会。</p>
<section>
定义文档中的节
<section>
<h1>PRC</h1>
<p>The People's Republic of China was born in 1949...</p>
</section>
<progress>
<progress> 标签不适合用来表示度量衡（例如，磁盘空间使用情况或查询结果）
<progress value="22" max="100">
</progress>
<p><b>注释：</b>Internet Explorer 9 以及更早的版本不支持 <progress> 标签。</p>
<meter>
Value 如果标签内没有数字，那么标量的实际值就是0
Max
Min
<p>
Christmas is in
<meter value ="30" min="1" max="366" title="days">
30 days!
</p>
<meter>标签中的内容可以不包含任何数字，这时最大值会被认为是1；
<meter value="0.25">
5.表单标签
<Datalist>
datalist 与 input 的新属性list一起使用可以创建组合框，双击input的时候可以提供选项让用户选择，类似历史记录一样。
<input list="browsers">
<datalist id="browsers">
<option value="Safari"> </option>
<option value="Internet Explorer"> </option>
<option value="Opera"> </option>
<option value="Firefox"> </option>
</datalist>
Input 类型 - email
email 类型用于应该包含 e-mail 地址的输入域。
在提交表单时，会自动验证 email 域的值。
E-mail: <input type="email" name="user_email" />
提示：iPhone 中的 Safari 浏览器支持 email 输入类型，并通过改变触摸屏键盘来配合它（添加 @ 和 .com 选项）。
Input 类型 - URL
url 类型用于应该包含 URL 地址的输入域。
在提交表单时，会自动验证 url 域的值。
Homepage: <input type="url" name="user_url" />
提示：iPhone 中的 Safari 浏览器支持 url 输入类型，并通过改变触摸屏键盘来配合它（添加 .com 选项）。
即使不被支持，仍然可以显示为常规的文本域。
Input 类型 - number
number 类型用于应该包含数值的输入域。
您还能够设定对所接受的数字的限定：
Points: <input type="number" name="points" min="1" max="10" />
提示：iPhone 中的 Safari 浏览器支持 number 输入类型，并通过改变触摸屏键盘来配合它（显示数字）。 即使不被支持，仍然可以显示为常规的文本域。
Input 类型 - range
range 类型用于应该包含一定范围内数字值的输入域。
range 类型显示为滑动条。
<input type="range" name="points" min="1" max="10" />
提示：iPhone 中的 Safari 浏览器支持 number 输入类型，并通过改变触摸屏键盘来配合它（显示数字）。即使不被支持，仍然可以显示为常规的文本域。
Input 类型 - Date Pickers（日期选择器）
date - 选取日、月、年
month - 选取月、年
week - 选取周和年
time - 选取时间（小时和分钟）
datetime - 选取时间、日、月、年（UTC 时间）
datetime-local - 选取时间、日、月、年（本地时间）
Date: <input type="date" name="user_date" />
即使不被支持，仍然可以显示为常规的文本域。
Input 类型 - search（搜索）
search 类型用于搜索域，比如站点搜索或 Google 搜索。
search 域显示为常规的文本域。
Input 类型 - color（搜索）
默认颜色 value=“#ff0000”
autofocus 属性
autofocus 属性规定在页面加载时，域自动地获得焦点。
注释：autofocus 属性适用于所有 <input> 标签的类型。
User name: <input type="text" name="user_name" autofocus="autofocus" />
placeholder 属性
placeholder 属性提供一种提示（hint），描述输入域所期待的值。
注释：placeholder 属性适用于以下类型的 <input> 标签：text, search, url, telephone, email 以及 password。
<input type="search" name="user_search" placeholder="Search" />
required 属性
required 属性规定必须在提交之前填写输入域（不能为空）。
Name: <input type="text" name="usr_name" required="required" />
即使不被支持，仍然可以显示为常规的文本域。
6.多媒体
音频和视频 (Audio + Video)
Audio和Video是首批添加到HTML规范中的标签。它们的加入使得我们可以像插入图片一样来处理音频及视频文件。
<audio src="sound.mp3" controls></audio>
图片6.png
<video src="movie.webm" autoplay controls></video>
图片5.png
ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
如需在 HTML5 中显示视频，所有需要的是：
<video src="movie.ogg" controls="controls"> </video>
tip：control 属性供添加播放、暂停和音量控件。
视频兼容
上面的例子使用一个 Ogg 文件，适用于Firefox、Opera 以及 Chrome 浏览器。
要确保适用于 Safari 浏览器，视频文件必须是 MPEG4 类型。
video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式：
<video width="320" height="240" controls="controls">
<source src="movie.ogg" type="video/ogg">
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Internet Explorer 8 不支持 video 元素。在 IE 9 中，将提供对使用 MPEG4 的 video 元素的支持。
如需在 HTML5 中播放音频，您所有需要的是：
<audio src="song.ogg" controls="controls">
tip：control 属性供添加播放、暂停和音量控件。
音频兼容
上面的例子使用一个 Ogg 文件，适用于Firefox、Opera 以及 Chrome 浏览器。
要确保适用于 Safari 浏览器，音频文件必须是 MP3 或 Wav 类型。
audio 元素允许多个 source 元素。source 元素可以链接不同的音频文件。浏览器将使用第一个可识别的格式：
<audio controls="controls">
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>
Internet Explorer 8 不支持 audio 元素。在 IE 9 中，将提供对 audio 元素的支持。
