第1章 —— HTML 5 与 HTML 4的区别
一、语法的改变
（1） HTML 5中的标记方法
1. 内容类型
HTML 5的文件扩展符不变，仍旧是.html或者.htm。
2. DOCTYPE声明
在HTML 5中，刻意的不使用版本号，一份文档将会适用所有版本的HTML。HTML 5中的声明方式（不区分大小写）：
<!DOCTYPE html>
3. 指定字符编码
<meta charset="UTF-8">
这种编码书写不可与之前的HTML 4书写同时使用，从HTML 5开始，对于文件的字符编码推荐使用UTF-8。
（2） HTML 5保证兼容性
HTML 5语法是为了保证与之前的HTML语法能够达到最大限度的兼容而设计的。
（3） 新增的元素和废除的元素
① 新增的结构元素
1. section元素
section元素表示页面中的一个内容区块，比如章节、页眉、页脚或页面中的其他部分。它可以与h1、h2、h3、h4、h5、h6等元素结合使用，标示文档结构。
<section>...</section>
2. article元素
article元素表示页面中的一块与上下文不相关的独立内容，譬如引入博客中的一篇文章或报纸中的一篇文章。
<article>...</article>
3. aside元素
aside元素表示article元素的内容之外的、与article元素的内容相关的辅助信息。
<aside>...</aside>
4. header元素
header元素表示页面中一个内容区块或整个页面的标题。
<header>...</header>
5. footer元素
footer元素表示整个页面或页面中一个内容区块的脚注。一般来说，它会包含创作者的姓名、创作日期以及创作者联系信息。
<footer>...</footer>
6. nav元素
nav表示页面中导航链接的部分。
<nav>...</nav>
7. figure元素
figure元素表示一段独立的流内容，一般表示文档主体流内容中的一个独立单元。使用figcaption元素为figure元素组添加标题。
<figure> <figcaption>...</figcaption> <p>...</p> </figure>
8. main元素
main元素表示网页中的主要内容。主内容区域意指与网页标题或应用程序中本页面主要功能直接相关或进行扩展的内容。
<main>...</main>
② 新增的其他元素
1. video元素
video元素用于定义视频，比如电影片段或其他视频流。
<video src="" controls="controls">video元素</video>
2. audio元素
audio元素用于定义音频，比如音乐或其他音频流。
<audio src="">audio元素</audio>
3. embed元素
embed元素用来插入各种多媒体，格式可以是Midi、Wav、AIFF、AU、MP3等。
<embed src="" type="">
4. mark元素
mark元素主要用来在视觉上向用户呈现那些需要突出显示或高亮显示的文字。mark元素的一个比较经典的应用就是在搜索结果中向用户高亮显示搜索关键词。
<mark></mark>
5. progress元素
progress元素表示运行中的进程，可以使用progress元素来显示JavaScript中耗费时间的函数的进程。
<progress></progress>
6. meter元素
meter元素代表度量衡，仅用于已知最大值和最小值的度量。必须定义度量的范围，既可以在元素的文本中，也可以在min/max属性中定义。
<meter></meter>
7. time元素
time元素用于表示日期或时间
<time></time>
8. ruby元素
ruby元素表示ruby注释。
9. rt元素
rt元素表示字符（中文注音或字符）的解释或发音。
10. rp元素
rp元素在ruby注释中使用，以定义不支持ruby元素的浏览器所显示的内容。
11. wbr元素
wbr元素表示软换行。wbr和br的区别在于：br元素是此处必须换行，而wbr元素的意思是浏览器窗口或父级元素的宽度足够宽时，不进行换行，而当宽度不够时，主动在此处换行。但是对于中文，貌没有多大的用处。
12. canvas元素
canvas元素表示图形，比如图表和其他图像。这个元素本身没有什么行为，但是会提供一块画布，把一个绘图API展现给客户端JavaScript，以使脚本能够把想绘制的东西绘制到这块画布上。
<canvas id="myCanvas" width="200" height="200"></canvas>
13. command元素
command元素表示命令按钮，比如单选按钮、复选按钮或按钮。
14. details
details元素表示用户要求得到并且可以得到的细节信息。可以和summary元素配合使用。summary元素提供标题或图例。标题是可见的，用户点击标题时，会显示细节信息。
<details>
<summary>HTML5</summary>
I have a pen.
</details>
15. datalist元素
datalist元素表示可选数据的列表，与input元素配合使用，可以制作出输入值的下拉列表。
<datalist></datalist>
16. datagrid元素
datagrid元素表示可选数据的列表，它以树形列表的形式显示。
17. keygen元素
keygen元素表示生成密钥。
18. output元素
output元素表示不同类型的输出。
19. source元素
source为媒介元素，定义媒介资源。
20. menu元素
menu元素表示菜单列表。当希望列出表单控件时使用该标签。
21. dialog元素
dialog元素表示对话框。
③ 新增的input元素类型
email： email类型表示必须输入e-mail地址的文本输入框。
url： url类型表示必须输入URL地址的文本输入框。
number： number类型表示必须输入数值的文本输入框。
range： range类型表示必须输入一定范围内数字值的文本输入框。
date： 选取日、月、年。
month： 选取月、年。
week： 选取周、年。
time： 选取时间（小时和分钟）。
datetime： 选取时间、日、月、年（UTC时间）。
datetime-local： 选取时间、日、月、年（本地时间）。
