一、HTML 基础
1.1、HTML 的基本概念
WWW（World Wide Web，万维网）是一种建立在 Internet 上的、全球性的、交互的、多平台的、
分布式的信息资源网络。它采用 HTML 语言描述超文本（Hypertext）文件。这里所说的超文本指的是包含有链接关系的文件，并且包含了多媒体对象的文件。WWW 有 3个基本组成部分，分别是 URL（统一资源定位器）、HTTP（超文本传输协议）和 HTML（超文本标识语言）。
URL（Universal Resource Locators）提供在 Web 上进入资源的统一方法和路径，使得用户所要访问的站点具有唯一性，这就相当于我们每个人只有一个身份证号一样。它说明了链接所指向的每个文件的类型及其准确位置。
HTTP（Hypertext Transfer Protocol）超文本传输协议是一种网络上传输数据的协议，专门用于传输以“超文本”（Hypertext）或“超媒体”（Hypermedia）的形式提供的信息。
HTML 语言（Hypertext Markup Language，中文通常称为超文本置标语言或超文本标记语言）是一种文本类、解释执行的标记语言，它是 Internet 上用于编写网页的主要语言。用 HTML 编写的超文本文件称为 HTML 文件。
要把信息发布到全球，就必须要使用能够被大众接受的语言，也就是使用一种大多数计算机能够识别的出版语言。在 WWW上，通常使用的发布语言是 HTML，即超文本标识语言。HTML 语言是一种简易的文件交换标准，有别于物理的文件结构，它旨在定义文件内的对象和措述文件的逻辑结构，而并不定义文件的显示。由于 HTML 所描述的文件具有极高的适应性，所以特别适合于 WWW 的出版环境。
HTML 是纯文本类型的语言，使用 HTML 编写的网页文件也是标准的纯文本文件。我们可以用任何文本编辑器，例如 Windows 的“记事本”程序打开它，査看其中的 HTML 源代码，也可以在用浏览器打开网页时，通过相应的“查看/源文件”命令查看网页中的 HTML 代码。HTML 文件可以直接由浏览器解释执行，而无须编译。当用浏览器打开网页时，浏览器读取网页中的 HTML 代码，分析其语法结构，然后根据解释的结果显示网页内容，正是因为如此，网页显示的速度同网页代码的质量有很大的关系，保持精简和高效的 HTML 源代码是十分重要的。
1.2、HTML 发展史与 HTML 5
1.2.1、HTML 的发展历史
HTML 的历史可以追溯到很久以前。1993年 HTML 首次以因特网草案的形式发布。20世纪90年代的人见证了 HTML 的高速发展，从 2.0版，到 3.2 版和 4.0 版，再到 1999 年的 4.01 版。随着 HTML 的发展，W3C（万维网联盟）掌握了对 HTML 规范的控制权。然而，在快速发布了这 4个版本之后，业界普遍认为 HTML 已经“无路可走”了，对 Web 标准的焦点也开始转移到了 XML 和 XHTML，HTML 被放在次要位置。不过在此期间，HTML 体现了顽强的生命力，主要的网站内容还是基于 HTML 的。为能支持新的 Web 应用，同时克服现有的缺点，HTML 迫切需要添加新功能，制定新规范。
致力于将 web 平台提升到一个新的高度，一小组人在 2004年成立了 WHATWG（Web Hypertex Application Technology Working Group,Web 超文本应用技术工作组）。他们创立了 HTML5 规范，同时开始专门针对 web 应用开发新功能——这被 WHATWG 认为是 HTML 中最薄弱的环节。Web 2.0 这个新词也就是在那个时候被发明的。Web 2.0 实至名归，开创了 Web 的第二个时代、旧的静态网站逐渐计位于需要更多特性的动态网站和社交网站——这其中的新功能真的是数不胜数。
2006年，W3C 又重新介入 HTML，并于 2008 年发布了 HTML5 的工作草案。2009年，XHTML2 工作组停止工作。又过一年，也就到了现在。因为 HTML5 能解决非常实际的问题，所以在规范还没有具体订下来的情况下，各大浏览器厂家就已经按捺不住了，开始对旗下产品进行升级以支持 HTML5 的新功能。这样，得益于浏览器的实验性反馈，HTML5 规范也得到了持续地完善，HTML5 以这种方式迅速融入对 Web 平台的实质性改进中。
1.2.2、HTML 4.01 和 XHTML
XHTML（extensible Hyper Text Markup Language，扩展的超文本标记语言），XHTML 和 HTML 4.01 具有很好的兼容性，而且 XHTML 是更严格、更纯净的 HTML 代码。
在早期的 HTML 发展历史中，由于 HTML从未执行严格的规范,而且各浏览器对各种错误的 HTML 极为宽容，这就导致了 HTML 显得极为混乱。所以 W3C 组织制订了 XHTML，它的目标是逐步取代原有的 HTML。简单地说，XHTML 就是最新版本的HTML规范。
我们习惯上认为 HTML 也是一种结构化文档，但实际上 HTML 的语法非常自由，再加上各浏览器对各种 HTML 错误的宽容，所以才有如下 HTML 代码。
<html>
<head>
<title>混乱的 HTML 文档</title>
<body>
<h1>混乱的 HTML 文档也能生效</h1>上面代码中的 <html>、<head>、<body> 和 <h1> 4 个标签都没有正确结束，这显然违背了结构化文
档的规则，但使用浏览器来浏览这个文档时，依然可以看到浏览效果，这就是 HTML 不规范的地方。
而 XHTML，致力于消除这种不规范，XHTML 要求 HTML 文档首先必须是一份 XML 文档。XML 文档是一种结构化文档，它有如下 4 条基本规则。
（1）整个文档有且仅有一个根元素。
（2）每个元素都由开始标签和结束标签组成（例如 <a> 和 </a> 就是开始标签和结束标签），除非使用空元素语法（例如 <br/> 就是空元素语法）。
（3）元素与元素之间应该合理嵌套。例如
<a>
<b>HTML 5 从入门到精通</b>
</a>
可以很明确地看出 <b> 元素是 <a> 元素的子元素，这就是合理嵌套；但
<a>
<b>HTML 5 从入门到精通</a>
</b>
这种写法就比较混乱，也就是所谓的不合理嵌套。
（4）元素的属性必须有属性值，而且属性值应该用引号（单引号或双引号）引起来。
通常，计算机里的浏览器可以应对各种不规范的 HTML 文档，但现在很多浏览器运行在移动电话和手持设备上，它们就没有能力来处理那些不规范的标记语言。为此，W3C 建议使用 XML 规范来约束 HTML 文档，将 HTML 和 XML 的长处加以结合，从而得到现在和未来都能使用的标记语言：XHTML。
XHTML 可以被所有的支持 XML 的设备读取，在其余的浏览器升级至支持 XML 之前，XHTML 强制 HTML 文档具有更加良好的结构，保证这些文档可以被所有的浏览器解释。
1.2.3、从 XHTML 到 HTML 5
虽然 W3C 努力为 HTML 制订规范，但由于绝大部分编写 HTML 页面的人并没有接受过专业训练，他们对 HTML 规范、XHTML 规范也不是很了解，所以他们制作的 HTML 网页绝大部分都没有遵守 HTML 规范。大量调查表明，即使在一些比较正规的网站中，也很少有网站能通过验证。例如 2008 年项 Alexa 关于全球 500 强网站的调査表明，仅有 6.57% 的网站能通过 HTML 规范验证。如果把那些名不见经传的小网站考虑在内，整个互联网上就几乎都是不符合规范的 HTML 页面。
虽然互联网上绝大部分 HTML 页面都是不符合规范的，但各种浏览器却可以正常解析并显示这些页面，在这样的情况下，HTML 页面的设计制作者甚至感觉不到遵守 HTML 规范的意义。于是出现了一种非常尴尬的局面：
一方面，W3C 组织极力地呼吁大家应该制作遵守规范的 HTML 页面；
另一方面，HTML 页面制作者却根本不太理会这种呼吁。
现有的 HTML 页面大量存在如下 4 种不符合规范的内容。
（1）元素的标签名大小写混杂的情况。比如
<p>HTML 5</P>这个 <p>元素的开始标签和结束标签采用了大小写不匹配的字符。
（2）元素没有合理结束的情况。比如只有 <p> 标签，没有 </p> 结束标签。
（3）元素中使用了属性，但没有指定属性值的情况。比如：
<input type="text" disabled/>（4）为元素的属性指定属性值时没有使用引号的情况。比如：
<input type=text >可能是出于“存在即是合理”的考虑，WHATWG 组织开始制订一种“妥协式”的规范：HTML 5。既然互联网上大量存在上面 4 种不符合规范的内容，而且制作者从来也不打算改进这些页面，因此 HTML 5 干脆承认它们是符合规范的。
由于 HTML5 规范不严格，因此 HTML5 甚至不再提供文档类型定义（DTD）。到 2008年，WHATWG 的努力终于被 W3C 认可，W3C 已经制订了 HTML5 草案。
虽然到目前为止，W3C 依然没有正式发布 HTML5 规范，但大量浏览器厂商和市场都已经开始承认 HTML 5，谷歌（Google）在很多地方都开始使用 HTML5。
1.3、迎接新的 Web 时代
自从 2010 年 HTML5 正式推出以来，它就以一种惊人的速度被迅速地推广，就连微软也因此为下一代 IE9 浏览器做了标准上的改进，使其能够支持 HTML5。关于各主流浏览器对于 HTML5 所表现出来的欢迎和支持情况，以及为什么 HTML5 会如此受欢迎，我们将在后面几节中做详细介绍。目前业界全体都在朝着 HTML5 的方向迈进，HTML5 的时代马上就要到来了。
1.3.1、部分代替了原来的 JavaScript
HTML5 增加了一些非常实用的功能，这些功能可以部分代替 JavaScript，而这些功能只要通过为标签增加一些属性即可。例如，打开一个页面后立即让某个单行文本框获得输入焦点，在 HTML5 之前，可能需要通过 JavaScript 来实现。代码如下。
<form>
<p>
<label>
用户名：<input name="search" type="text" id="search"/>
</label>
</p>
<script type="text/javascript">
document.getElementById("search").focus();
</script>
</form>
上面的代码片段通过 JavaScript 来完成这个功能，但在 HTML5 中则只需要设置一个属性即可。如果使用 HTML5，则可以把上面的代码改为如下形式。
<form>
<p>
<label>
用户名：<input type="text" name="search" autofocus/>
</label>
</p>
</form>
在这个示例中，我们可以看到，在 HTML4 中使用了一段 JavaScript 代码，在 HTML5 中并没有使用，取而代之的是一个在 HTML5 中新出现的属性。
把两个代码片段放在一起进行对比，不难发现使用 HTML5 之后简洁多了。除了这里示范的 autofocus 可用于自动获得焦点之外，HTML5 还支持其他一些属性，比如一些输入校验的属性，以前都必须通过 JavaScript 来完成，但现在都只要一个 HTML5 属性即可。
1.3.2、更明确的语义支持
在 HTML5 之前，如果要表达一个文档结构，可能只能通过 <div> 元素来实现。例如，我们来看在 HTML4 中的一种页面结构，代码如下。
<div id="header">
</div>
<div id="nav">
</div>
<div class="article">
</div>
<div id="aside">
</div>
<div id="footer">
</div>在上面的页面结构中，所有的页面元素都采用 <div> 元素来实现，不同 <div> 元素的 id 不同，不同 id 的<div> 元素代表不同含义，但这种采用 <div> 布局的方式导致缺乏明确的语义，因为所有内容都是 <div> 元素。
HTML5 则为上面的页面布局提供了更明确的语义元素，此时可以将上面的代码片段改为如下形式。
<header>
</header>
<nav>
</nav>
<article>
</article>
<aside>
</aside>
<footer>
</footer>在这个示例中，我们可以看到，在 HTML4 中常见的用 div 来划分页面结构的方法，到了 HTML5 中也被一种新出现的标签替代了。这些标签可以提供更加清晰的语义。
除此之外，以前的 HTML 可能会通过 <em> 这样的元素来表示“被强调”的内容，但到底是哪一种强调，HTML 却无法表达；HTML5 则提供了更多支持语义的强调元素，例如：
<time>
2025-2-22
</time>
<mark>
被标记的文本
</mark>
上面的第一个 <time> 元素用于强调被标记的内容是日期或时间，而 <mark> 元素则用于强调被标记的文本。HTML5 新增的这两个元素比 <em> 元素提供了更丰富的语义。
1.3.3、增强了 Web 应用程序功能
一直以来，HTML 页面的功能被严格地限制着：
（1）客户端从服务器下载 HTML 页面数据，浏览器负责呈现这些 HTML 页面数据。
（2）出于对客户机安全性的考虑，以前的 HTML 在安全性方面确实做得足够安全。
当 HTML 页面做得太安全之后，我们就需要通过 JavaScript 等其他方式来增加 HTML 的功能。换句话来说，HTML 对 Web 程序而言功能太单一了，比如上传文件时想同时选择多个文件都不行，前端开发者不得不通过 Flash、JavaScript 等各种技术来克服这个困难。为了弥补这种不足，HTML5 规范增加了不少新的 API，而各种浏览器正在努力实现这些 API 功能，在未来的日子里，使用 HTML5 开发 Web 应用将会更加轻松。
1.3.4、HTML5 的目标
HTML5 的目标主要是为了能够创建更简单的程序，书写出更简洁的代码。例如，为了使 Web 应用程序的开发变得更加容易，HTML5 中提供了很多 API。为了使 HTML 代码变得更简洁，在 HTML5 中开发出了新的属性、新的元素等。总体来说，HTML5 为下一代 Web 平台提供了许许多多新的功能。先来了解一下在 HTML5 中究竟提供了哪些革命性的新功能。
首先，在 HTML5 之前，有很多功能必须要使用 JavaScrpt 等脚本语言才能实现，比如前面例子中提到，在运行页面时经常使用的让文本框获得光标焦点的功能。如果使用 HTML5，同样的功能只要使用元素的属性标签就可以实现了。这样的话，整个页面就变得非常清楚直观，容易理解。因此，Web 设计者可以放心大胆地使用这些 HTML5 中新增的属性标签。由于 HTML5 中提供了大量的这种可以替代脚本的属性标签，使得开发出来的界面语言也变得更加简洁易。
不但如此，HTML5 使页面的结构也变得更加清楚。之前使用的 div 标签也不再使用了，而是使用前面第二个示例中所提到的更加语义化的结构标签。这样，书写出来的界面结构就会显得非常清晰，页面中的各个部分要展示什么内容也会让人一目了然。
虽然 HTML5 宣称的立场是“非革命性的发展”，但是它所带来的功能是让人渴望的，使用它所进行的设计也是很简单的，因此，它深受 Web 设计者与开发者的欢迎。
1.4、各浏览器对 HTML5 的支持
HTML5 被说成是划时代也好，具有革命性也好，如果不能被业界承认并且大面积地推广使用，这些都是没有意义的。事实上，今后 HTML5 被正式地、大规模地投入应用的可能性是相当高的。
通过对 IE、谷歌、Firefox、Safari、0pera 等主流浏览器的发展策略的调查，发现它们都在支持 HTML5 上采取了一定的措施。
（1）微软
2010年3月16日，微软公司在拉斯维加斯举行的 MIX10 技术大会上宣布已推出 IE9 浏览器开发
者预览版。微软称，IE9 开发完成后，将会更好地支持 CSS3、SVG 和 HTML5 等互联网浏览通用标准。
（2）谷歌
2010年2月19日，谷歌 Gears 项目经理伊安-费特通过博客宣布，谷歌将放弃对 Gears 浏览器插件项目的支持，以此重点开发 HTML5 项目。据费特表示，目前，在谷歌看来，Gears 面临的主要问题是，该应用与 HTML5 的诸多创新非常相似，而且谷歌一直积极发展 HTML5 项目。因此，只要谷歌不断以加强新网络标准的应用功能为工作重点，那么为 Gears 增加新功能就无太大意义了。目前，多种浏览器将会越来越多地为 GMa 及其他服务提供更多脱机功能方面的支持，因此 Gears 面临的需求也在日益下降，这是谷歌做出上述调整的重要原因。
（2）Mozila
2010年1月，Mozia 基金会发布了即将推出的 Firefox4 浏览器的第一个早期测试版。在该版本中的 Firefox 浏览器中进行了大幅改进，包括新的 HTML5 语法分析器，以及支持更多 HTML5 形式的控制等。从官方文档来看，Firefox4 对 HTML5 是完全级别的支持，包括在线视频、在线音频等多种应用。
（3）苹果
2010年6月7日，苹果公司在开发者大会的会后发布了 Safari5，这款浏览器至少支持 10个以上的 HTML5 新技术，包括全屏幕播放、HTML5 视频、HTML5 地理位置、HTML5 切片元素、HTML5 的可拖动属性、HTML5 的形式验证、HTML5 的 Ruby、HTML5 的 Ajax 历史和 WebSocket 字幕。
（4）Opera
2010年5月5日，Opera 软件公司首席技术官 Hakon Wium Lie 先生在访华之际，接受了中国软件资讯网等少数几家媒体的采访。号称“CSS之父”的 Hakon WiumLie 认为，HTML5 与 CSS3 将是全球互联网发展的未来趋势，目前包括 Opera 在内的诸多浏览器厂商，纷纷在研发 HTML5 相关产品，Web 的未来属于 HTML5。从Opera10 开始，Opera 对 HTML5 的支持就十分出色。以上证据表明，目前这些浏览器都纷纷地朝着支持HTML5、结合 HTML5 的方向迈进着，因此HTML5已经被广泛地推行开来了。
在 HTML5 以前，各浏览器对 HTML和 JavaScript 的支持很不统一，这样就造成了同一个页面在不同浏览器中的表现不同。HTML5 的目标是详细分析各浏览器所具有的功能，并以此为基础制订一个通用规范，要求各浏览器能支持这个通用标准。
就目前的形势来看，各浏览器厂商对 HTML5 都抱着极大的热情，尤其是微软因为对 HTML5 的支持不够积极，导致 IE（Internet Explorer）市场份额下滑的事实，更成为各浏览器厂商的前车之鉴。如果各浏览器都能统一地遵守 HTML5 规范，以后前端程序员开发 HTML+CSS+JavaScript 页面时将会变得更加轻松。
1.5、HTML5 要解决的 3 个问题
HTML5 的出现，对于 Web 来说意义是非常重大的。因为它的意图是想要把目前存在的各种问题一并解决掉，它是一个企图心比较强的 HTML 版本。那么，到底 Web上存在哪些问题，HTML5 又打算怎么解决呢?
（1）浏览器之间的兼容性很低
首先要提到的就是，Web 浏览器之间的兼容性是非常低的。在某个 Web 浏览器上可以正常运行的HTML/CSS/JavaScript 等 Web 程序，在另一个 Web 浏览器上就不正常了的事情是非常常见的。如果用一句话来描述这个问题的原因，可以说是“规范不统一”。规范不统一，没有被标准化，是出现这个问题的主要原因。
在 HTML5 中，这个问题将得到解决。HTML5 的使命是详细分析各浏览器所具有的功能，然后以此为基础，要求这些浏览器所有内部功能都要符合一个通用标准。
如果各浏览器都符合通用标准，然后以该标准为基础来编写程序，那么程序在各 Web 浏览器都能正常运行的可能性就大大提高了，这对于 Web 开发者和设计者都是一件令人可喜的事情。而且，今后开发者开发出来的 web 功能只要符合通用标准，Web 浏览器也都是很愿意封装该功能的。
（2）文档结构不够明确
第二个问题是，在之前的 HTML 版本中，文档的结构不够清晰和明确。例如，为了要表示“标题’“正文”，之前一般都是用 div 元素。但是，严格说来，div 不是一个能把文档结构表达得很清楚的元素，使用了过多的 div 元素的文章，阅读时不仔细研究，是很难看出文档结构的。而且，对于搜索引擎或屏幕阅读器等程序来说，过多使用了 div 元素，那么这些程序就连“从哪到哪算是重要的正文”“这个 ul 元素是表示导航菜单，还是表示项目列表”等对于结构分析来说最基本的问题的答案也都不知道。
在 HTML5 中，为了解决这个问题，追加了很多与结构相关的元素。不仅如此，还结合了包括微格式、无障碍应用在内的各种各样的周边技术。
（3）Web应用程序的功能受到了限制
最后一个问题是，HTML 与 Web 应用程序的关系十分薄弱。Web 应用程序的特征是先从网络下载，然后忠实运行，因此应该对会威胁到用户安全的功能进行限制。
目前安全性的保障方面已做到了，但对于 Web 应用程序来说，一直以来 HTML 真正所做出的贡献是很少的，比如就连上传文件时想同时选择一个以上的文件都做不到。
为了弥补这方面的不足，HTML5 已经开始提供各种各样 Web 应用上的新 API，各浏览器也在快速地封装着这些 API，HTML5 已经使丰富 Web 应用的实现变成了可能。
1.6、HTML的基本结构
1.6.1、HTML 文件的编写方法
（1）HTML 标签
一个 HTML 文件是由一系列的元素和标签组成的。元素是 HTML 文件的重要组成部分，例如 title（文件标题）、img（图像）及 table（表格）等。元素名不区分大小写。HTML 用标签来规定元素的属性和它在文件中的位置。
HTML 的标签分单独出现的标签和成对出现的标签两种。大多数标签成对出现，是由首标签和尾标签组成的。首标签的格式为 <元素名称>，尾标签的格式为</元素名称>。其完整语法如下。
<元素名称>要控制的元素</元素名称>成对标签仅对包含在其中的文件部分发生作用，例如 <tite> 和 </title> 标签用于界定标题元素的范围，也就是说，<title> 和 </tite> 标签之间的部分是此 HTML 文件的标题。单独标签的格式为<元素名称>，其作用是在相应的位置插入元素，例如 <br> 标签便是在该标签所在位置插入一个换行符。
说明在每个 HTML 标签，大写、小写和混写均可。例如<HTML>、<html>和<Html>，其结果都是一样的。
在每个 HTML 标签中，还可以设置一些属性，控制 HTML 标签所建立的元素。这些属性将位于所建立元素的首标签，因此，首标签的基本语法如下。
<元素名称 属性 1="值 1" 属性 2 = "值 2">而尾标签的建立方式则为：
</元素名称>因此，在 HTML 文件中某个元素的完整定义语法如下。
<元素名称 属性 1="值 1" 属性 2 = "值 2">元素资料</元素名称>语法中，设置各属性所使用的“"”可省略。
（2）元素的概念
当用一组 HTML 标签将一段文字包含在中间时，这段文字与包含文字的 HTML 标签被称之为一个元素。
由于在 HTML 语法中，每个由 HTML 签与文字所形成的元素内，还可以包含另一个元素。因此整个 HTML 文件就像是一个大元素，包含了许多小元素。
在所有 HTML 文件，最外层的元素是由 <html> 标签建立的。在 <html> 标签所建立的元素中，包含了两个主要的子元素，这两个子元素是由 <head> 标签与 <body> 标签所建立的。<head> 标签所建立的元素的内容为文件标题，而 <body> 标签所建立的元素内容为文件主体。
（3）HTML 文件结构
在介绍 HTML 文件结构之前，先来看一个简单的 HTML 文件及其在浏览器上的显示结果。
下面开始编写一个 HTML 文件，使用文件编辑器，例如 Windows 自带的记事本。
<html>
<head>
<title>
文件的标题
</title>
</head>
<body>
文件的正文
</body>
</html>运行效果如图 1.1 所示。
图 1.1 HTML 示例
从上述代码中可以看出 HTML 文件的基本结构如图 1.2 所示
图 1.2 HTML 文件的基本结构
其中，<head> 与 </head> 之间的部分是 HTML 文件的文件头部分，用以说明文件的标题和整个文件的一些公共属性。<body> 与 </body> 之间的部分是 HTML 文件的主体部分，下面介绍的标签，如果不加特别说明，均是嵌套在这一对标签中使用的。
1.6.2、文件开始标签 <html>
在任何的一个 HTML 文件里，最先出现的 HTML 标签就是 <html>，它用于表示该文件是以超文本标识语言（HTML）编写的。<html> 是成对出现的，首标签 <html> 和尾标签 </html> 分别位于文件的最前面和最后面，文件中的所有文件和 HTML 标签都包含在其中。例如：
<html>文件的全部内容</html>该标签不带任何属性。事实上，现在常用的 Web 浏览器（例如）都可以自动识别 HTML 文件，并不要求有<html> 标签，也不对该标签进行任何操作。但是，为了提高文件的适用性，使编写的 HTML 文件能适应不断变化的 Web 浏览器，还是应该养成使用这个标签的习惯。
1.6.3、文件头部标签<head>
习惯上，把 HTML 文件分为文件头和文件主体两个部分。文件主体部分就是在 Web 浏览器窗口的用户区内看到的内容，而文件头部分用来规定该文件的标题（出现在 Web 浏览器窗口的标题栏中）和文件的一些属性。
<head> 是一个表示网页头部的标签。在由 <head> 标签所定义的元素中，并不放置网页的任何内容，而是放置关于 HTML 文件的信息，也就是说它并不属于 HTML 文件的主体。它包含文件的标题、编码方式及 URL 等信息。这些信息大部分是用于提供索引、辨认或其他方面的应用。写在 <head> 与 <head> 中间的文本，如果又写在 <title> 标签中，表示该网页的名称，并作为窗口的名称显示在这个网页窗口的最上方。如果 HTML 文件并不需要提供相关信息时，可以省略 <head> 标签。
1.6.4、文件标题标签 <title>
每个 HTML 文件都需要有一个文件名称。在浏览器中，文件名称作为窗口名称显示在该窗口的最上方。这对浏览器的收藏功能很有用。如果浏览者认为某个网页对自己很有用，今后想经常阅读，可以选择 IE 浏览器“收藏”菜单中的“添加到收藏夹”命令将它保存起来，供以后调用。网页的名称要写在 <title> 和 </title> 之间，并且 <title> 标签应包含在 <head> 与 </head> 标签之中。
HTML 文件的标签是可以嵌套的，即在一对标签中可以嵌入另一对子标签，用来规定母标签所含范围的属性或其中某一部分内容，嵌套在 <head> 标签中使用的主要有 <title> 标签。
1.6.5、文件主体标签 <body>
<body> 标签是成对出现的。网页中的主体内容应该写在 <body> 和 </body> 之间，而 <body> 标签包含在 <html> 标签里面。
1.6.6、编写文件的注意事项
在编写文件时，要注意以下事项。
(1)“<”和“>”是任何标记的开始和结束。元素的标记要用这对尖括号括起来，并且结束的标记总是在开始的标记前加一个斜杠。
（2）标记与标记之间可以嵌套，如：
<H2>
<CENTER>初识 HTML 文件</CENTER>
</H2>（3）在源代码中不区分大小写，如以下几种写法都是正确并且相同的标记。
<HEAD>
<head>
<Head>（4）任何回车和空格在源代码中不起作用。为了代码清晰，建议不同的标记之间回车编写
（5）HTML 标记中可以放置各种属性，如：
<h2 align="center">
HTML 初露端倪
</h2>其中 align 为属性，center 为属性值，元素属性出现元素的 <> 内，并且和元素名之间有一个空格分属性值可以直接书写，也可以使用 "" 括起来。如下面的两种写法都是正确的。
<h2 align="center">HTML 初露端倪</h2>
<h2 align=center>HTML 初露端倪</h2>（6）如果希望在源代码中添加注释，便于阅读，可以以“<!--”开始，以“--!>”结束。如下代码。
<!--文档注释-->
<html>
<head>
<title>
文件的标题
</title>
</head>
<body>
文件的正文
</body>
</html>注释语句只出现在源代码中，而不会在浏览器中显示。
1.7、编写第一个 HTML 文件
1.7.1、HTML 文件的编写方法
编写 HTML 文件主要有如下 3 种方法。
（1）手工直接编写
由于 HTML 语言编写的文件是标准的 ASCI 文本文件，所以我们可以使用任何的文本编辑器来打开并编写 HTML 文件，如 Windows 系统中自带的记事本。
（2）使用可视化软件
Microsof 公司的 Frontpage、Macromedia 公司的 Dreamweaver、Adobe 公司的 Golive 等软件均可以可视化的方式进行网页的编辑制作。
（3）由 Web 服务器一方实时动态生成
这需要进行后端的网页编程来实现，如 ASP、PHP 等，一般情况下都需要数据库的配合。
1.7.2、手工编写页面
下面先使用记事本来编写第一个 HTML 文件。步骤如下。
（1）选择“开始/程序/附件/记事本”命令，打开记事本程序
（2）在记事本中直接输入下面的 HTML 代码。
<html>
<head>
<title>简单的 HTML 文件</title>
</head>
<body text="blue">
<h2 align="center">初始 HTML</h2>
<hr />
<p>让我们一起体验炫酷的 HTML 旅程吧</p>
</body>
</html>（3）输入代码后，记事本中显示出代码的内容，如图所示
（4）选择记事本菜单中的“文件/保存”命令，另存为桌面文件
（5）修改文件类型为 .html 文件
（6）双击文件，即可查看效果
