HTML5系列：HTML5与HTML4的区别
1. 语法的改变
1.1 DOCTYPE声明
DOCTYPE声明在HTML文件中必不可少，位于文件第一行。
HTML4中声明方法：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
HTML5中声明方法：
<!DOCTYPE html>
1.2 字符编码
HTML4指定方式：
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
HTML5指定方式：
<meta charset="utf-8" />
1.3 元素标记
不允许写结束标记的元素：br、embed、hr、img、input、link、meta、param。
不允许写结束标记的元素是指不允许使用开始标记与结束标记将元素括起来的形式，只允许使用<元素/>。
示例：
错误方式：<br></br> 正确方式：<br/>
1.4 具有boolean值的属性
<!--只写属性不写属性值，属性为true--> <input type="checkbox" checked /> <!--不写属性，属性为false--> <input type="checkbox" /> <!--属性值=属性名，属性为true--> <input type="checkbox" checked="checked" /> <!--属性值=空字符串，属性为true--> <input type="checkbox" checked="" />
2. HTML5新增元素
2.1 HTML5新增结构元素
在HTML5中新增的结构元素：
section元素
section元素表示页面中的一个内容区块，如章节、页眉或页面中的其他部分，可以与h1、h2、h3、h4、h5、h6等元素结合使用，标示文档结构。
<section></section>
article元素
article元素表示页面中的一块与上下文不相关的独立内容，如博客中的一篇文章或报纸中的一篇文章。
<article></article>
aside元素
aside元素表示article元素的内容之外的、与article元素的内容相关的辅助信息。
<aside></aside>
header元素
header元素表示页面中一个内容区块或整个页面的标题。
<header></header>
hgroup元素
hgroup元素用于对整个页面中一个内容区块的标题进行组合。
<hgroup></hgroup>
footer元素
footer元素表示整个页面或页面中一个内容区块的脚注。一般会包含作者姓名、创作日期以及作者联系方式等。
<footer></footer>
section、article、aside、header、hgroup、footer都对应于HTML4中的div元素。
nav元素
nav元素表示页面中导航链接的部分。
HTML5示例：
<nav></nav>
HTML4示例：
<ul></ul>
figure元素
figure元素表示一段独立的流内容，一般表示文档主题流内容的一个独立单元。使用figcaption元素为figure元素组添加标题。
<figure> <figcaption></figcaption> <p></p> </figure>
2.2 HTML5新增的其他元素
video元素
video元素定义视频。
<video src="" controls="controls">Video元素</video>
audio元素
audio元素定义音频
<audio src="">audio元素</audio>
embed元素
embed元素用于插入各种多媒体，格式可以是Midi、wav、MP3等。
<embed src="" />
mark元素
mark元素主要用来在视觉上向用户呈现需要突出或高亮显示是文字。mark元素的一个比较经典的应用是在搜索结果中向用户高亮显示搜索关键词，与HTML4中span使用方式相同。
<mark></mark>
time元素
time元素表示日期、时间或同时表示日期时间。与HTML4中span使用方式相同。
<time></time>
canvas元素
canvas元素表示图形，如图表或图像。这个元素本身没有行为，仅提供一块画布，它把一个绘制API展现给JavaScript，以使JavaScript能够进行绘制。
<canvas id="id" width="200" height="200"></canvas>
details元素
details元素表示用户要求得到并且可以得到的细节信息。可以与summary元素配合使用。summary元素提供标题或图例。summary元素是details元素的第一个子元素。
<details> <summary>HTML5</summary> Content </details>
datalist元素
datalist元素表示可选数据的列表，与input元素配合使用，可以制作出输入值的下拉列表。
<datalist></datalist>
datagrid元素
datagrid元素表示可选数据的列表，可以树形列表的形式来显示。
<datagrid></datagrid>
menu元素
menu元素表示菜单列表。
<menu> <li></li> <li></li> </menu>
2.3 新增input元素的类型
email类型表示必须输入Email的文本输入框。
<input type="email" />
url
url类型表示必须输入URL的文本输入框。
number
number类型表示必须输入数值的文本输入框。
range
range类型表示必须输入一定范围内数字值的文本输入框。
Date Pickers
date 选取日、月、年
month 选取月、年
week 选取周、年
time 选取时间（小时、分钟）
datetime 选取时间、日、月、年（UTC时间）
datetime-local 选取时间、日、月、年（本地时间）
3. HTML5新增属性
3.1 新增表单属性
autofocus属性
对input（type=text）、select、textarea元素设置autofocus属性，让元素在页面打开时自动获得焦点。
<input type="text" autofocus />
placeholder属性
对input（type=text）、textarea元素设置placeholder属性，提示用户可以输入的内容。
<input type="text" placeholder="请输入" />
required属性
对input（type=text）、textarea元素设置required属性，检查必须输入。
<input type="text" required="required" />
