HTML5 新特性

HTML5是HTML最新的修订版本。

HTML5 新特性

语义特性

HTML5赋予网页更好的意义和结构。新增了一些语义化的标签，比如

、

、

、

等。

本地存储特性

HTML5 新增了一些存储功能，localstorage等。

设备兼容特性

HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连。

连接特性

更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，Server-Sent Event和WebSockets就是其中的两个特性，这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能。

网页多媒体特性

支持网页端的Audio、Video等多媒体功能， 与网站自带的APPS，摄像头，影音功能相得益彰。

基于SVG、Canvas、WebGL及CSS3的3D功能，用户会惊叹于在浏览器中，所呈现的惊人视觉效果。

性能与集成特性

HTML5通过XMLHttpRequest2等技术，解决以前的跨域等问题，使Web应用和网站在多样化的环境中更快速的工作。

常见的HTML5 新增标签

• 结构类

标签	描述
	定义了文档的头部区域
	导航
	定义 section 或 document 的页脚
	定义页面内容之外的内容
	定义页面正文内容
	定义文档中的节（section、区段）
	规定文档的主要内容 ，这部分内容在文档中应当是独一无二的，不包含任何在一系列文档中重复的内容

eg.

• 新表单元素

标签	描述
	定义选项列表。与 input 元素配合使用该元素（使用 input 元素的 list 属性来绑定 datalist），来定义 input 可能的值
	规定用于表单的密钥对生成器字段
	定义不同类型的输出，比如脚本的输出

• 多媒体

标签	描述
	定义视频（video 或者 movie）
	定义音频内容
	标签定义图形，比如图表和其他图像。该标签基于 JavaScript 的绘图 API
	定义多媒体资源
	定义嵌入的内容，比如插件
	为诸如

input 新增类型

email

email.png

url

同上，格式不对时，会提示，相当于做了一次正则验证。

number

只允许输入数字，可以设定对所接受的数字的范围，并且右侧有加减按钮。如果是在手机端打开的话，弹出的是手机数字键盘。

number.png

range

range.png

Date Picker

一般很少直接用，因为样式可能不符合我们的要求......

• Date

Date.png

• month

month.png

• week

week.png

• time

image.png

• datetime-local