HTML5介绍 - HTML5的特长，特性及其相关资源

柔情只为你懂 2022-03-15 14:19 227阅读 0赞

日期：2013-3-29  来源：[GBin1.com][]

## [![HTML5介绍 - HTML5的特长，特性及其相关资源][HTML5_ - HTML5]][HTML5_ - HTML5_HTML5_ - HTML5]    ##

## 什么是HTML5？ ##

[![d98790a0-3b3d-4879-b244-6dafeb34a5fe.png][]][d98790a0-3b3d-4879-b244-6dafeb34a5fe.png 1]

HTML5 是万维网联盟（W3C）推出的最新的超文本标记语言。第一稿出版于2008年，但是直到2011年才真正的发展起来。在2011年的时候，HTML5开始发布，人们逐渐开始使用它，但是相关的浏览器对它的支持仍很贫乏。直到今日，几乎所有主流浏览器（Chrome，Safari，Firefox，Opera，IE）都提供了对 HTML5的支持，现在才是HTML5真正发挥它特性的时候。

HTML5和CSS3目前仍在开发中。W3C计划明年发布一个稳定版本，但是看起来这仍是一个胆大的冒险。从HTML5发布至今，它一直在持续发展中，W3C添加了越来越多令人印象深刻的特性，因此看起来HTML5的开发远远不会结束，当然这并不是一件坏事。

HTML5是1999年首次发布的HTML4.01的继任者。从1999年开发网络开发有了翻天覆地的变化，HTML5的出现是必然的。新出的标记语言建立在预留标准上：

*  新特性基于HTML，CSS，DOM和JavaScript
 *  对外部的插件（如Flash）的需求需要减少
 *  错误处理要比过去的版本更加简单
 *  脚本被更多的标记所替代
 *  HTML5特性必须与设备无关
 *  开发过程必须对大众是可视的

## HTML5的新特性？ ##

HTML5 的创建是为了使编码过程更加简单并具有逻辑性。再过不久，你会看到许多已过时的语法会很快被提出后门。伴随HTML5而来的是在多媒体方面的，独特而又令 人印象深刻的特性。考虑到让用户可以在低功率的设备上运行繁重的内容，许多特性伴随HTML5衍生而来。语法特色上包 括<video>,<audio>和<canvas>元素，而且还集成了矢量图形内容(例如我们之前就知道的<object>标签)。这意味着网络上的多媒体和图形内容可以被更快捷的执行，不需要插件或者API。

这里有一组新添加的语法，但是以下我列出了较为重要的一部分。其余的可以在W3C的[HTML5部分][HTML5]找到。

*  **<article>** \- 这个标签定义了文章，用户留言或是帖子，作为内容的独立项目。
 *  **<aside>** \- ***aside***标签标记了除了页面内容的内容，例如一个横向的侧边栏。
 *  **<header>,<footer>** \- 你不再需要手动为页首与页尾命名ID，现在你有为他们而生的预定义标签。
 *  **<nav>** \- nav标签用于标记导航，可以自动使你的列表像个导航。
 *  **<section>** \- 这是另一个重要的新语法，它在可以你的文档里定义任何类型的段落。它像div一样划分了不同的段落。
 *  **<audio>,<video>** \- 这两个标签明显标记了语音和视频内容，使音频与视频更容易得在设备上运行。
 *  **<embed>** \- 这个新标签为交互内容(如插件）或外部应用定义了一个容器。
 *  **<canvas>** \- canvas标签叫人尤为兴奋，它允许通过脚本实现画图(大多是JavaScript，当然其他的脚本语言也可以)。

阅读相关教程：

[HTML5基本标签使用header，nav和footer][HTML5_header_nav_footer]

[HTML5中的Article和Section元素][HTML5_Article_Section]

需要记住的重要的一点是，新的HTML5标签和以前的标签不太一样。例如，<header>和<footer>标签不仅仅是用于标 记页面的开始和截止，还用于标示每一个段落的开始和结束。这意味着这两个标签比以前应用的更多。你可以通过下面的代码明白我所说的。

<!DOCTYPE html>
        <head> 
        </head>
        <body>
             <header> 
             <nav>
             </nav>
             </header>
             <section> 
                <header>
                
                </header>
                <article>
                </article>
                <footer>
                
                </footer>
           </section> 
           <aside>
           
           </aside>
           <footer>
           
           </footer>
    </body>
    </html>

是的，DOCTYPE声明有一定道理。或者至少，这一次它比以前要简单的多，它很容易让我记住，我们不需要在网络上搜索它，并且从一个站点复制到另一个站点。***<!DOCTYPE html>***起始，以***</html>***结束一个页面让我们等了很长一段时间，现在它终于出现在了这里.......

## ......    ##

## 相关教程 ##

[HTML5入门教程 ][HTML5]

[Semantics of HTML5][]

[37个绝对不容错过的HTML5教程和资源 ][37_HTML5_]

[高效HTML5代码开发最佳实践][HTML5 1]

via [ Nelly@极客标签][Nelly]

来源：[HTML5介绍 - HTML5的特长，特性及其相关资源][GBin1.com]

[GBin1.com]: http://www.gbin1.com/technology/html/20130329-html5-introduction/
[HTML5_ - HTML5]: http://www.gbin1.com/technology/html/20130329-html5-introduction/title.jpg
[HTML5_ - HTML5_HTML5_ - HTML5]: http://www.gbin1.com/technology/html/20130329-html5-introduction/index.html
[d98790a0-3b3d-4879-b244-6dafeb34a5fe.png]: http://www.gbtags.com/gb/networks/uploadimgthumb/d98790a0-3b3d-4879-b244-6dafeb34a5fe.png
[d98790a0-3b3d-4879-b244-6dafeb34a5fe.png 1]: http://www.gbtags.com/gb/networks/uploadimg/d98790a0-3b3d-4879-b244-6dafeb34a5fe.png
[HTML5]: http://www.gbin1.com/tutorials/html5-tutorial/
[HTML5_header_nav_footer]: http://www.gbin1.com/technology/html/20130115-html5-basic-tags/
[HTML5_Article_Section]: http://www.gbin1.com/technology/html/20130320-html5-elements-section-article/
[Semantics of HTML5]: http://www.html5rocks.com/en/features/semantics
[37_HTML5_]: http://www.gbin1.com/technology/html/20120801-html5-ziyuan/
[HTML5 1]: http://www.gbin1.com/technology/html/20120810-html5-coding/
[Nelly]: http://www.gbtags.com/gb/share/652.htm