初识HTML

1.HTML介绍

1.1 HTML 简介

HTML 全称为 HyperText Mark-up Language，翻译为超文本标签语言，标签也称作标记或者元素。HTML 是目前网络上应用最为广泛的技术之一，也是构成网页文档的主要基石之一。HTML文本是由 HTML 标签组成的描述性文本，HTML 文本可以说明文字、图形、动画、声音、表格、链接等。

超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓"超级链接"和存在媒体文件（也就是超越了普通文本文件）。

HTML 的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。需要说明的是 HTML 不是编程语言，而是一种描述性的语言，用于描述超文本中内容的显示方式。比如，文字以什么颜色、大小显示，图片以什么尺寸、位置来显示等。这些描述都是用 HTML 标签来描述的。

1.2 HTML历史

HTML 的前身是 SGML 语言，SGML 的前身是 GML 语言。GML（Generalized Markup Language：通用标签语言）是一种 IBM 格式化文档语言，用于就其组织结构、各部件及其之间的关系进行文档描述。GML 将这些描述标记为章节、重要小节和次重要小节（通过标题的级来区分）、段落、列表、表等。GML 是 SGML（StandardGeneralized Markup Language，标准通用标记语言）的先驱和基础，SGML 是当今创建结构化文档描述语言规则的战略集合。

HTML于1990年出现，web之父 Tim Berners-Lee 发布了《HTML标签》 的论文，借用SGML的标记语法。

IETF（互联网工程任务组）推出HTML2.0，并且在逐步的完善过程，不同的组织对于HTML的语法标记等，都有不同的处理模式，出现百家争鸣的现象。随着发展，W3C 组织代替IETF组织成为了新的HTML标准，后续HTML有了迅速的发展。至1999年，HTML4.01标准的发布，成为了HTML发展非常重要的一个里程碑，在web中大量使用，沿用至今。

此后，W3C组织发布XHTML1.0，期望以XML的标准来约束HTML更加的规范，对HTML进行了语法非常严格的规范，但是又没有增加新的标签或者特性。在某种程度上来说，这是好事，规范了HTML语法的标准。但是，接下来，W3C非(sang)常(xin)大(bing)胆(kuang)的推出了它的XHTML2.0，并且不向前兼容，以至于甚至不兼容HTML。这就是web的异常灾难了。

2004年，以Opera公司的Lan Hickson发起了在HTML上的扩展和web应用适配的活动，被W3C拒绝。于是Opera、Apple、Mozilla自发组织WAHTWG组织，开始就HTML的新标准进行自行维护，并依托于web forms2.0和web app 1.0标准，开始研发HTML5的语法标准。反观W3C在XHTML的道路上坎坷不断，终于在2010年前后，W3C颁布发表停止了XHTML2的继续维护。开始以WAHTWG的研究为基础，开发研发HTML 5语法标准。

发展至今，HTML 5已经被大部分浏览器兼容，并且大量应用于web网站中。如图1-1就是主要版本的变迁过程。

​

图1-1

​

从初期的网络诞生后，已经出现了许多HTML版本，下图1-2就是主要版本发布的时间。

​

图1-2

​

在1990年，万维网之父Tim Berners-Lee（图1-3），搭建了全球第一个web站点（http://info.cern.ch），为了纪念，到目前为止，该站点还可以访问，内容也是当年的那个页面，图1-4。

​

图1-3

​

​

图1-4

​

1.3 HTML特点

• 简单灵活

• 可扩展

• 平台无关性

第2章 开发准备工作

2.1 环境的安装和配置

任何技术或者编程语言，在开始开发使用的时候，首先都会进行环境的安装和配置，HTML也不例外，那么HTML的开发需要哪些准备工作呢？

2.1.1 开发环境

HTML作为web开发的基石，一直以简单著称，所以开发HTML只需要简单的记事本工具即可，如：EditPlus、sublime、VSCode等等，当然主流的编程IDE绝大多数都是支持HTML的开发的，如：eclipse、IntelliJ IDEA、pycharm等，当然也有专门前端开发的IDE--WebStorm、Hbuilder等，在开发的前期建议使用记事本工具，以便于练习代码的手感，等基础功打好之后，就可以使用这些IDE开发，提高开发的效率了。

2.1.2 运行环境

HTML是web页面的基石，所以运行环境就是主流的浏览器。建议使用Google公司的Chrome浏览器。

2.2 浏览器的历史

20世纪中后期，互联网已经初具雏形。到20世纪90年代，全球进入互联网时代，浏览器成为人们获取互联网信息不可或缺的工具。经过数十年发展，浏览器技术已愈发成熟，产品也呈现出多样化态势，主流的产品包括了微软公司的Internet Explorer、苹果公司的Safari、Mozilla开源社区的Firefox、Opera公司开发的Opera浏览器以及Google公司推出的Chrome浏览器等。

简单地说，浏览器是一种渲染和呈现网页的软件。互联网在形成之初，浏览器只支持纯文本展示。随着W3C对Web技术的推进与标准化，现在的浏览器已经可以呈现丰富的多媒体信息，如图像、声音、视频和Flash动画等。同时通过对脚本语言的支持，实现用户与网页之间的互动，从而大大增强了网络信息浏览的用户体验。

浏览器的历史要追溯到1990年，那时的浏览器只能显示纯文本。1993年，伊利诺斯州立大学的超级计算应用国家中心发布了第一个支持图形渲染的浏览器------ Mosaic，从那之后，互联网开始呈爆炸性的趋势增长，Mosaic浏览器的诞生为图形化的网页设计奠定了基础。

1994年，Netscape公司发布了Navigator浏览器。该浏览器继承了Mosaic建立起来的商业模式，即在网上免费发布产品，以建立广泛的用户基础。Navigator迅速取代了Mosaic，成为了用户的首选。

不过，这种状态没有持续多长时间。不久，微软看到了互联网的潜力，1995年他们开发了IE(Internet Explorer)浏览器。由于微软将IE与流行的桌面操作系统Windows进行捆绑销售，使得用户无须安装第三方浏览器，即可方便地进行网页浏览。随着Windows操作系统用户数量不断增多，Internet Explorer的用户群开始持续增长，不断蚕食Netscape公司所占有的浏览器市场，第一次浏览器大战以微软的IE浏览器大获全胜，网景公司破产结束。

Netscape随后调整了自身战略，开放其源代码，成立了Mozilla，来应对微软的挑战。此举虽然未能挽回Netscape的市场占有率，但却催生了今天广受欢迎的Firefox浏览器。在Mozilla成立的初期，Mozilla项目吸引了大量开发者，为之贡献代码和智慧，至2002年，它已发展成一个稳定而强大的互联网套件。Mozilla 1.0的出现被视为其里程碑；同年，衍生出Phoenix（后改名Firebird，最后又改为Firefox）。之后广为人知的浏览器Firefox 1.0终于在2004年正式发布。

另外，开源浏览器引擎WebKit也被许多浏览器产品所使用。WebKit的前身是KDE项目的HTML渲染引擎（KHTML）和JavaScript执行引擎。苹果公司将WebKit移植到了Mac OS上，并于2003年发布了基于WebKit的Safari浏览器。Google于2008年推出的Chrome浏览器，也采用了WebKit内核。

谷歌的掀起的第二次浏览器大战，微软的IE浏览器失败，谷歌的Chrome浏览器成为了大赢家。到了2010年，随着移动互联网的发展，微软也自己放弃了IE浏览器的开发和维护，使用WebKit内核研发了全新一代浏览器Edge浏览器，试图重新打造自己的浏览器市场，但是目前来看，成功的概率不高。

2.3 几款主要的浏览器

目前浏览器市场份额最高的是谷歌的Chrome浏览器，其次是火狐浏览器（Mozilla Firefox）、微软的Edge浏览器、微软的IE浏览器、Opera浏览器等。

在浏览器的发展历程中，有几个主流浏览器是必定会被写入互联网发展史的。这些浏览器包括：Mosaic浏览器、网景浏览器(Netscape Navigator)、IE浏览器（Internet Explorer）、Opera浏览器、Mozilla Firefox浏览器、Chrome等。

至于国内的360、搜狗这些双核浏览器，其实质就是使用了Chrome的webkit内核和微软的IE内核的包装品，方便了普通用户的使用，开发者建议使用谷歌的Chrome浏览器，兼容性很高，同时提供了方便好用的程序员调试工具。

2.4 W3C简介(万维网联盟)

2.4.1 W3C的由来

万维网（World Wide Web）是作为欧洲核子研究组织的一个项目发展起来的，在那里 Tim Berners-Lee 开发出万维网的雏形。Tim Berners-Lee - 万维网的发明人 - 目前是万维网联盟的主任。W3C 在 1994 年被创建的目的是，为了完成麻省理工学院（MIT）与欧洲粒子物理研究所（CERN）之间的协同工作，并得到了美国国防部高级研究计划局（DARPA）和欧洲委员会（European Commission）的支持。

万维网联盟（World Wide Web Consortium，W3C），又称W3C理事会。1994年10月在麻省理工学院计算机科学实验室成立。建立者是万维网的发明者蒂姆·伯纳斯·李。

万维网联盟是国际最著名的标准化组织。1994年成立后，至今已发布近百项相关万维网的标准，对万维网发展做出了杰出的贡献。目前，万维网联盟拥有来自全世界40个国家的400多个会员组织，已在全世界16个地区设立了办事处。2006年4月28日,万维网联盟在中国内地设立首个办事处。

W3C 致力于实现所有的用户都能够对 web 加以利用（不论其文化教育背景、能力、财力以及其身体残疾）。W3C 同时与其他标准化组织协同工作，比如 Internet 工程工作小组（Internet Engineering Task Force）、无线应用协议（WAP）以及 Unicode 联盟（Unicode Consortium）。

W3C 由美国麻省理工学院计算机科学和人工智能实验室 (MIT CSAIL)，总部位于法国的欧洲信息数学研究联盟 (ERCIM) 和日本的庆应大学（Keio University）联合运作，并且在世界范围内拥有分支办事处。

2.4.2 W3C的贡献

W3C为解决 Web 应用中不同平台、技术和开发者带来的不兼容问题，保障 Web 信息的顺利和完整流通，万维网联盟制定了一系列标准并督促 Web 应用开发者和内容提供者遵循这些标准。标准的内容包括使用语言的规范，开发中使用的导则和解释引擎的行为等等。W3C也制定了包括XML和CSS等的众多影响深远的标准规范。 但是，W3C 制定的 web 标准似乎并非强制而只是推荐标准。因此部分网站仍然不能完全实现这些标准。特别是使用早期所见即所得网页编辑软件设计的网页往往会包含大量非标准代码。

W3C 最重要的工作是发展 Web 规范（称为推荐，Recommendations），这些规范描述了 Web 的通信协议（比如 HTML 和 XHTML）和其他的构建模块。每项 W3C 推荐的发展是通过由会员和受邀专家组成的工作组来完成的。工作组的经费来自公司和其他组织，并会创建一个工作草案，最后是一份提议推荐。一般来说，为了获得正式的批准，推荐都会被提交给 W3C 会员和主任。

2.4.3 中国W3C大事件

2011年1月11日 ，腾讯公司签约加入万维网联盟（World Wide Web Consortium，W3C），双方达成战略合作关系，将共同参与包括web App、HTML5等新互联网技术标准的研究和制定，推动中国互联网产业快速发展。

2011年9月15日消息，百度（纳斯达克证券代码：BIDU）已经加入万维网联盟（W3C）。百度在加入万维网联盟之后，将能够与全球500家IT和互联网企业联手，共同研究和制定互联网开放平台及无线互联网技术等相关的国际互联网网络标准。

2013年1月21日，W3C宣布将北京航空航天大学(BUAA)加入其主机构列表中，使其成为全球第四所具备该机构主机资格的高校以及近15年来的首个全新加入的主要机构。北航成为继麻省理工学院、法国INRIA、日本庆应义塾大学之后的第四所高校主机机构。

2.5 HTML语法

语法结构：HTML 标签。

<标签 属性="值">内容</标签>

    <p> 是 HTML 中的段落标签，下面以 <p> 为例来详细解释标签。

语法格式：HTML 标签，如图2-1所示

​

图2-1

​

语法解析：

标签通常是成对出现的，分为开始标签（p）和结束标签(/p)，结束标签只是在开始标签前加一个斜杠"/"。标签可以有属性（align），属性必须有值(center )。 开始标签与结束标签中包含的内容称之为区域。标签不区分大小写，p和P是相同的。

2.6 网页分类

HTML 使用标签编写网页，网页基本上可以分为 2 类。

• 静态网页 HTML

  静态网页是指在不修改网页源文件的情况下，网页无论在何时何地被浏览，都将显示相同的内容，网页的内容不会发生变化。静态网页文件的扩展名包括 html,htm 等。

• 动态交互式网页

  交互式网页是指用户可以提供给网站信息，网站根据用户提交的信息响应用户的要求。如网上注册、论坛、调查等等。在这门课的最后部分我们会体验交互式网页，在第二学期将深入学习。交互式网页文件的扩展名包括 aspx，jsp，php，asp 等。