HTML5

HTML5是HTML最新的修订版本
HTML5 中的一些新特性：

• 用于绘画的 canvas 元素

• 用于媒介回放的 video 和 audio 元素

• 对本地离线存储的更好的支持

• 新的特殊内容元素，比如 article、footer、header、nav、section

• 新的表单控件，比如 calendar、date、time、email、url、search

HTML5 的改进
新元素、新属性、完全支持 CSS3
Video 和 Audio、2D/3D 制图
本地存储、本地 SQL 数据、Web 应用

HTML5多媒体

<audio>	定义音频内容
<video>	定义视频（video 或者 movie）
<source>定义多媒体资源 <video> 和 <audio>
<embed>	定义嵌入的内容，比如插件。
<track>	为诸如 <video> 和 <audio> 元素之类的媒介规定外部文本轨道。

< video >视频
< video > 元素提供了 播放、暂停和音量控件来控制视频。
在html5中显示视频：

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
</video>

< video > 元素支持多个 < source > 元素、
width 和 height 属性控制视频的尺寸、
< source > 元素可以链接不同的视频文件。

MP4 : 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM : 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
Ogg : 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件

< Audio >音频标签
HTML5 提供了播放音频文件的标准。
在html5中播放音频：

<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
</audio>

control 属性供添加播放、暂停和音量控件。
< audio >元素支持三种音频格式文件: MP3, Wav, 和 Ogg:

HTML 新的input类型

Input 类型: color
color 类型用在input字段主要用于选取颜色

选择你喜欢的颜色：<input type="color" name="favcolor">

Input 类型: date
date 类型允许你从一个日期选择器选择一个日期。

选择一个日期：<input type="date" name="day">

Input 类型: datetime
datetime 类型允许你选择一个日期（UTC 时间）。

生日 (日期和时间): <input type="datetime" name="bdaytime">

Input 类型: email
email 类型用于应该包含 e-mail 地址的输入域。

E-mail: <input type="email" name="email">

Input 类型: number
number 类型用于应该包含数值的输入域。

数量 ( 1 到 5 之间 ): <input type="number" name="quantity" min="1" max="5">

使用下面的属性来规定对数字类型的限定：
disabled	规定输入字段是禁用的
max			规定允许的最大值
maxlength	规定输入字段的最大字符长度
min			规定允许的最小值
pattern		规定用于验证输入字段的模式
readonly	规定输入字段的值无法修改
required	规定输入字段的值是必需的
size		规定输入字段中的可见字符数
step		规定输入字段的合法数字间隔
value		规定输入字段的默认值

Input 类型: range
range 类型用于应该包含一定范围内数字值的输入域。
range 类型显示为滑动条。

<input type="range" name="points" min="1" max="10">

可使用下面的属性来规定对数字类型的限定：

max - 规定允许的最大值
min - 规定允许的最小值
step - 规定合法的数字间隔
value - 规定默认值

Input 类型: tel
定义输入电话号码字段:

电话号码: <input type="tel" name="usrtel">

Input 类型: url
url 类型用于应该包含 URL 地址的输入域。

在提交表单时，会自动验证 url 域的值。

<input type="url" name="homepage">

HTML5应用

• 本地数据存储
• 访问本地文件
• 本地 SQL 数据
• 缓存引用
• Javascript 工作者
• XHTMLHttpRequest 2

HTML5图形

• 使用 < canvas > 元素。
• 使用内联 SVG。
• 使用 CSS3 2D 转换、CSS3 3D 转换。

HTML5 使用 CSS3

• 新选择器
• 新属性
• 动画
• 2D/3D 转换
• 圆角
• 阴影效果
• 可下载的字体

HTML新的语义和结构元素

什么是语义元素?
语义= 意义
语义元素 = 有意义的元素
无语义元素实例:

<div>

<span>

<form>

<table>

<img>

已移除元素

以下的 HTML 4.01 元素在HTML5中已经被删除:

• < acronym >
• < applet >
• < basefont >
• < big >
• < center >
• < dir >
• < font >
• < frame >
• < frameset >
• < noframes >
• < strike >

最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。