下载掌阅APP，畅读海量书库
立即打开
HTML5 自诞生以来，作为新一代的 Web 标准，越来越受开发人员及设计师的欢迎。HTML5 有强大的兼容性，可以一次开发、到处使用，因此大大减少了跨平台开发人员的数量及成本，特别是在如今日新月异的移动时代。
HTML5是2010年正式推出的，引起了世界上各大浏览器开发商的极大热情，如Fire Fox、Chrome、IE9等。那HTML5为什么会如此受欢迎呢？
在新的HTML5语法规则当中，部分JavaScript代码将被HTML5的新属性所替代，部分Div 的布局代码也将被 HTML5 变为更加语义化的结构标签，这使得网站前段的代码变得更加的精炼、简洁和清晰，让代码所要表达的意思也更一目了然。
HTML5是一种设计来组织Web内容的语言，其目的是通过创建一种标准的和直观的标记语言来把Web设计和开发变得容易起来。HTML5提供了各种切割和划分页面的手段，允许创建的切割组件不仅能用来逻辑地组织站点，而且能够赋予网站聚合的能力。这是HTML5富于表现力的语义和实用性美学的基础，HTML5 赋予设计者和开发者各种层面的能力来向外发布各式各样的内容，从简单的文本内容到丰富的、交互式的多媒体无不包括在内。如图2-6所示，HTML5技术用来实现动画特效。
HTML5提供了高效的数据管理、绘制、视频和音频工具，促进了Web上和便携式设备的跨浏览器应用的开发。HTML5 具有更大的灵活性，支持开发非常精彩的交互式网站。其还引入了新的标签和增强性的功能，其中包括了优雅的结构、表单的控制、API、多媒体、数据库支持和显著提升的处理速度等。
HTML5 中的新标签都是高度关联的，标签封装了它们的作用和用法。HTML 的过去版本更多的是使用非描述性的标签，然而，HTML5 拥有高度描述性、直观的标签，其提供了丰富的能够立刻让人识别出内容的内容标签。例如，被频繁使用的<Div>标签已经有了两个增补进来的<section>和<article>标签。<video>、<audio>、<canvas>和<figure>标签的增加也提供了对特定类型内容的更加精确的描述。
我们之所以学习 HTML5，最主要的原因之一是现今的绝大多数浏览器都支持它。即使在IE6上，你也可以使用HTML5并慢慢转换旧的标记。你甚至可以通过W3C验证服务来验证HTML5代码的标准化程度（当然，这也是有条件的，因为标准仍在不断演进）。
如果你用过HTML或XML，肯定会知道文档类型（doctype）声明。其用途在于告知验证器和编辑器可以使用哪些标签和属性，以及文档将如何组织。此外，众多Web浏览器会通过它来决定如何渲染页面。一个有效的文档类型常常通知浏览器用“标准模式”来渲染页面。
以下是许多网站使用的相当冗长的 XHTML 1.0 Transitional 文档类型。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
相对于这一长串，HTML5的文档类型声明出乎意料地简单。
<!doctype html>
把上述代码放在文档开头，就表明在使用HTML5标准。
在HTML5中，大量的元素得以改进，并有了更明确的默认值。我们已经见识了文档类型的声明是多么简单，除此之外还有许多其他输入方面的简化。例如，以往我们一直这样定义JavaScript的标签。
<script language="javascript" type="text/javascript">
但在 HTML5 中，我们希望所有的<script>标签定义的都是 JavaScript，因此，你可以放心地省略多余的属性（指language和type）。
如果想要指定文档的字符编码为UTF-8方式，只需按下面的方式使用<meta>标签即可。
<meta charset="utf-8">
上述代码取代了以往笨拙的，通常靠复制粘贴方式来完成处理的方式。
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
HTML5中规定的语法，在设计上兼顾了与现有HTML之间最大程度的兼容性。下面就来看看具体的HTML5语法。
1．可以省略标签的元素
在HTML5中，有些元素可以省略标签，具体来讲有三种情况.
（1）必须写明结束标签
area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr
（2）可以省略结束标签
li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th
（3）可以省略整个标签
HTML、head、body、colgroup、tbody
需要注意的是，虽然这些元素可以省略，但实际上却是隐形存在的。
例如，“<body>”标签可以省略，但在 DOM 树上它是存在的，可以永恒访问到“document.body”。
2．取得boolean值的属性
取得布尔值（boolean）的属性，例如disabled和readonly等通过默认属性的值来表达“值为true”。
此外，在属性值为true时，可以将属性值设为属性名称本身，也可以将值设为空字符串。
<!--以下的checked属性值皆为true-->
<input type="checkbox" checked>
<input type="checkbox" checked="checked">
<input type="checkbox" checked="">
3．省略属性的引用符
在HTML4中设置属性值时，可以使用双引号或单引号来引用。
在HTML5中，只要属性值不包含空格、“<”、“>”“'”“"”“`”“=”等字符，都可以省略属性的引用符。
实例如下。
<input type="text">
<input type='text'>
<input type=text>