HTML5

二.语义

1.HTML5中的节段和提纲

HTML5 中新的提纲和节段元素一览: <section>,<article>,<nav>,<header>,<footer>,<aside>和<hgroup>.

2.使用HTML5的音频和视频

<audio> 和 <video> 元素嵌入和允许操作新的多媒体内容。

3.HTML5的表单

看一下 HTML5 中对 web 表单的改进：强制验证 API，一些新的属性，<input>属性type的一些新值 ，新的<output>元素。

4.新的语义元素

除了节段，媒体和表单元素之外，还有众多的新元素，例如， <figure>，<data>，<time>， <progress>，<main>，这增加了有效的HTML5元素的数量。

三.连通性

1.Web Sockets

允许在页面和服务器之间建立持久连接并通过这种方法来交换非 HTML 数据。

2.Server-sent events

允许服务器向客户端推送事件，而不是仅在响应客户端请求时服务器才能发送数据的传统范式。

3.WebRTC

这项技术，其中的 RTC 代表的是即时通信，允许连接到其他人，直接在浏览器中控制视频会议，而不需要一个插件或是外部的应用程序。

四.离线 & 存储

1.离线资源：应用程序缓存

火狐全面支持 HTML5 离线资源规范。其他大多数针对离线资源仅提供了某种程度上的支持。

2.在线和离线事件

Firefox 3 支持 WHATWG 在线和离线事件，这可以让应用程序和扩展检测是否存在可用的网络连接，以及在连接建立和断开时能感知到。

3.DOM储存

客户端会话和持久化存储让 web 应用程序能够在客户端存储结构化数据。DOM存储的机制是通过存储字符串类型的键/值对,来提供一种安全的存取方式.这个附加功能的目标是提供一个全面的,可以用来创建交互式应用程序的方法(包括那些高级功能,例如可以离线工作一段时间).

4.IndexedDB

是一个为了能够在浏览器中存储大量结构化数据，并且能够在这些数据上使用索引进行高性能检索的 Web 标准。

五.多媒体

1.使用HTML5的音频和视频

<audio> 和 <video> 元素嵌入和允许操作新的多媒体内容。

2.WebRTC

这项技术，其中的 RTC 代表的是即时通信，允许连接到其他人，在浏览器中直接控制视频会议，而不需要一个插件或是外部的应用程序。

3.使用Carmera API

允许使用，操作计算机摄像头，并从中存储图像。

六.图像

1.canvas

可被用来通过脚本（通常是JavaScript）绘制图形。比如,它可以被用来绘制 图形,制作图片集合,甚至用来实现动画效果。你可以在元素标签内写入可提供替代的的代码内容，这些内容将会在在旧的、不支 持<canvas>元素的浏览器或是禁用了JavaScript的浏览器内渲染并展现。

2.WebGL

WebGL 通过引入了一套非常地符合 OpenGL ES 2.0 并且可以用在 HTML5<canvas>元素中的 API 给 Web 带来了 3D 图像功能。

七.性能 & 集成

1.Web Workers

能够把 JavaScript 计算委托给后台线程，通过允许这些活动以防止使交互型事件变得缓慢。

2.XMLHttpRequestLevel 2

允许异步读取页面的某些部分，允许其显示动态内容，根据时间和用户行为而有所不同。这是在 Ajax背后的技术。

3.即时编译的 JavaScript 引擎

新一代的 JavaScript 引擎功能更强大，性能更杰出。

4.History API

允许对浏览器历史记录进行操作。这对于那些交互地加载新信息的页面尤其有用。

5.拖放

HTML5 的拖放 API 能够支持在网站内部和网站之间拖放项目。同时也提供了一个更简单的供扩展和基于 Mozilla 的应用程序使用的 API。

6.HTML中的焦点管理

支持新的 HTML5 activeElement 和 hasFocus 属性。

7.基于Web的协议处理程序

你现在可以使用 navigator.registerProtocolHandler() 方法把 web 应用程序注册成一个协议处理程序。

8.requestAnimationFrame

允许控制动画渲染以获得更优性能。

9.全屏API

为一个网页或者应用程序控制使用整个屏幕，而不显示浏览器界面。

10.指针锁定API

允许锁定到内容的指针，这样游戏或者类似的应用程序在指针到达窗口限制时也不会失去焦点。

11.在线和离线事件

为了构建一个良好的具有离线功能的 web 应用程序，你需要知道什么时候你的应用程序确实离线了。顺便提一句，在你的应用程序又再回到在线状态时你也需要知道。

八.样式

CSS已经扩展到能够以一个更加复杂的方法给元素设置样式。这通常被称为 CSS3, 尽管 CSS 已经不再是很难触动的规范，并且不同的模块并不全部位于 level 3：其中一些位于 level 1 而另一些位于 level 4，覆盖了所有中间的层次。

1.新的背景样式特性

现在可以使用 box-shadow给逻辑框设置一个阴影，而且还可以设置多背景。

2.更精美的边框

现在不仅可以使用图像来格式化边框，使用border-image和它关联的普通属性，而且可以通过 border-radius属性来支持圆角边框。

3.为你的样式设置动画

使用transitions以在不同的状态间设置动画，或者使用 animations 在页面的某些部分设置动画而不需要一个触发事件，你现在可以在页面中控制移动元素了。 

4.排版方面的改进

作者们如今有更强大的能力来使自己的网页文字达到更佳的排版。他们不但可以控制 text-overflow 和 hyphenation， 还可以给它设置一个阴影或者更精细地控制它的 decorations。感谢新的 @font-face 规则，现在我们可以下载并应用自定义的字体了。

5.新的展示性布局，这些布局的详解我后面的博客会慢慢写出来，敬请期待。

为了提高设计的灵活性，新的布局被添加了进来： 

1.align-items

2.align-self

3.flex

4.flex-basis

5.flex-direction

6.flex-flow

7.flex-grow

8.flex-wrap

9.justify-content