2、内容与展式分离

b和i标签依然保留，但它们意义和之前有不同，这些标签的意义是为了将一段文字标识出来，而不是为了设置粗体或斜体样式。u,font,center,strike这些标签则被完全去掉了。

立即学习“前端免费学习笔记（深入）”；

3、新增加一些全新的表单输入对象

包括日期，URL，Email地址，其它的对象则增加了对非拉丁字符的支持。HTML5还引入了微数据，这一使用机器可以识别的标签标注内容的方法，使语义Web的处理更为简单。总的来说，这些与结构有关的改进使内容创建者可以创建更干净、更容易管理的网页，这样的网页对搜索引擎、对读屏软件等更为友好。

4、全新的、更合理的标签

多媒体对象将不再全部绑定在object或embedTag中，而是视频有video标签，音频有audio标签。

5、本地存储

增加了localStorage/sessionStorage/indexedDB等浏览器端存储功能。

6、Canvas对象

将给浏览器带来直接绘制图形的能力，可以直接在浏览器中操作图形。

7、新的HTML50扩展

为HTMLDocument和HTMLElement接口提供了新的API扩展。

8、新语法

（1）DOCTYPE

HTML5的HTML语法要求文档必须声明DOCTYPE以确保浏览器可以在标准模式下展示页面。声明方式是：

不区分大小写。

（2）Charset

HTML5的HTML语法里，有三种形式可以声明HTML51的encoding类型：

• 在传输级别（transport level）上，在HTTP实例的header里设置Content-Type。

• 在文件的开头，设置一个Unicode的Bype Order Mark(BOM)，该字符为文件的encoding方式提供了一个签名。

• 在文档的前1024个byte之间的内容里，使用带有charset属性的meta元素来声明encoding方式。例如：。

（3）MathML和SVG

HTML5的HTML语法允许在文档里使用MathML（数学标记语言）和SVG（可伸缩HTML52）元素。例如，一个非常简单的HTML页面包含一个svg元素画出的圆：

 A green circle: 

section

section 元素是对页面文档结构进行划分的最基本也是最主要的结构元素，主要用来对网站或应用程序中的页面上的内容进行层次结构上的划分。一个section元素通常由内容及其标题组成。

如果元素的内容集中到一起显示可以表达相应的意思的话，可以定义成article元素，而没必要使用section元素。

section元素不是一般的容器元素，所以如果一个元素需要定义相应的style或script脚本的话，推荐使用p元素，section的使用是确保这个元素的内容能够明确地展示在文档的大钢里。

如：

    
    
Graduation
    

        
Ceremony
        
Opening Procession
        
Speech by Validactorian
        
Speech by Class President
        
Presentation of Diplomas
        
Closing Speech by Headmaster
    
    

        
Graduates
        

            
Molly Carpenter
            
Anastasia Luccio
            
Ebenezar McCoy
            
Karrin Murphy
            
Thomas Raith
            
Susan Rodriguez
        
    

article

article 元素代表文档、页面或应用程序中的所有“正文”部分，它所描述的内容应该是独立的、完整的、可以独自被外部HTML53的，可以是一篇博客、一篇报刊中的文章、一篇论坛帖子、一段用户评论、一个独立的插件，或任何独立于上下文中其他部分的内容。

article是一个特殊的section标签，它比section具有更明确的语义，它代表一个独立的、完整的相关内容块。一般来说，article会有标题部分。

当article内嵌article时，原则上来说，内部的article的内容是和外层的article内容相关的。例如，一篇博客中，包含用户提交的评论的article应该嵌套在包含博客文章article中。

    
Safari 5 released
    
7 Jun 2010. Just after the announcement of the new iPhone 4 at WWDC.
    
Apple announced the release of Safari 5 for Windows and Mac......

nav

nav 元素是一个可以作为HTML54的链接组，其中的导航元素链接到其他页面或当前页面的其他部分。一个页面可以拥有多个nav元素，作为页面整体不同部分的导航。在nav元素中，一般以ul列表的形式来具体放置该组链接元素。

下面是HTML55给出的一个示例代码：

    
The Wiki Center Of Exampland
    
    

        

            
 Demos in Exampland
            
Written by A. N. Other.
        
        
        

            

                
Public demonstrations
                
 ...more...
            
            

                
Demolitions
                
...more...
            
            ...more...        

        
    
    

aside

aside元素用来表示当前页面或文章的附属信息部分，它可以包含与当前页面或主要内容相关的引用、侧边栏、广告、导航条、以及其他有别于主要内容的部分。

根据目前的规范，aside元素有两种使用方法：

• 被包含在article中作为主要内容的附属信息部分，其中的内容可以是当前文章有关的引用，词汇列表等。

• 在article外使用，作为页面或站点全局的附属信息部分；最典型的形式是侧边栏，其中的内容可以是友情链接、附属导航或广告单元等。

下面的代码示例综合了以上两种方法：

    

        
My Blog
    
    

        
My Blog Post
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
            incididunt ut labore et dolore magna aliqua.
        
    
    

hgroup

hgroup 元素是将标题及其子标题进行HTML56的元素。hgroup元素通常对h1~h6元素进行分组，如将一个内容区块的标题及其子标题划为一组：

  
Welcome to my WWF
  
For a living planet
The rest of the content...

header

header 元素是一种具有引导作用和导航作用的结构元素，通常用来放置整个页面或页面内的一个article元素或section元素的标题，也可以包含其他内容，例如数据HTML57、搜索表单或相关的logoHTML58。

我们可以使用该标签来显示整个网页的标题部分：

    
The most important heading on this page

同一个页面内，每一个内容区块都可以有自己的header元素，例如：

 
  
The most important heading on this page
 
  
   
    
Title of this article
 
  
 
  
...Lorem Ipsum dolor set amet...

footer

footer 元素可以作为其上层父级内容区块或一个根区块的脚注。footer 元素通常包括其相关区块的脚注信息，如作者、相关阅读链接以及版权信息等。

过去(及目前)，我们通常使用类似下面这样的代码来写页面的页脚：

  

     
copyright
     
sitemap
     
contact
     
to top
  

在HTML5中，我们可以不使用p，而用更加HTML59的footer来写：

在同一个页面中可以使用多个footer元素，即可以用作页面整体页脚，也可以作为一个内容区块的结尾，例如，我们可以将footer直接写在section或是article中：

   Section content appears here.   

   Article content appears here.   

address

address元素用来在文档中呈现联系信息，包括文档创建者的名字、站点链接、电子邮箱、真实地址、电话号码等；address不只是用来呈现电子邮箱或真实地址这样的“地址”概念，而应该包括与文档创建人相关的各类联系方式信息。

根据以上定义，我们可以使用下面的代码来展示一些志愿者的名字及主页链接：

The HTML5 Doctor is run by the following group of volunteers:

  Jack Osborne,  
  Rich Clark,  
  Mike Robinson,
  

下面是另一个范例：

video

通过

过去(及目前)，我们通常要使用类似下面这样繁冗丑陋的代码来将视频放置在页面中，但这种方式要求浏览器属性0有Flash插件，并支持属性1：

HTML5的方式：

• 属性2: 用来设定视频是否在页面加载后自动播放。

• Src: 为视频指定文件链接或下载路径，当浏览器不支持

• Autobuffer: 用来设定视频是否自动缓冲；如果设定，那么页面加载之后，视频会自动下载缓冲，当用户点击播放按钮后，至少已经有一部分视频可以直接观看而无需等待了。

• Poster: 用来为视频设置一个“相框默认图片”性质的背景图片；当视频无法正常加载播放时可以向用户呈现。

• Controls: 用来设置是否为视频添加控制条，例如“播放”、“暂停”等；控制条的外观可以自定义。

• Loop: 用来设置视频是否循环播放。

• Width , Height: 用来控制视频的宽度与高度。

audio

HTML5中的新元素标签

• src：音频文件路径。

• autobuffer：设置是否在页面加载时自动缓冲音频。

• autoplay：设置音频是否自动播放。

• loop：设置音频是否要循环播放。

• controls：设置是否显示播放控制面板。

可以看到这些属性和

根据定义规范，以下几种API方法是可以使用的：

• play()：播放音频

• pause()：暂停播放

• canPlayType()：命令浏览器判断当前音频文件是否可以被播放

• buffered()：设定文件需要缓冲部分的开始与结束时间点。

另外，我们可以使用元素标签来配合

datalist

datalist 与 input 的新属性list一起使用可以创建组合框，双击input的时候可以提供选项让用户选择，类似历史记录一样。