氢原子百科 
HTML的全称为超文本标记语言 （HyperText Markup Language），是用来描述网页的一种语言，是由W3C（World Wide Web Consortium，万维网联盟）推荐发布的通用国际标准。不同于 C++、Python 等编程语言，HTML 是一种标记语言，由一套标记标签（markup tag）构成的。HTML 使用标记标签来描述网页。在纯文本文件中包含了HTML 的指令代码，在 HTML 中，每个标签（Tag）都是一条指令，用来告诉浏览器如何将图片、声音、文字、影像等在页面中显示出来。[1][5]HTML文档又称为 Web 页面。[6][7]
HTML 的前身为Web的发明者Tim Bemers-Lee（蒂姆·伯纳斯·李）和其同事Daniel W.Connolly（丹尼尔·康诺利）于1990年创立SGML。[2]1993年发布HTML的首个版本，它是IETF（互联网工程任务组）团队的一个草案，之后相继推出了HTML 2.0/3.2/4.0/5.0版本，[3]在此过程中，万维网联盟还推出了XHTML，但由于其没有反映出网站开发人员在网页上的交互操作，也未能将网页上已有的内容往后兼容等原因最终宣告失败。[8]
HTML的基本结构包括HTML的语法结构，文档结构、标签的格式以及代码的编写规范等。[9]HTML具有简易性、可扩展性、平台无关性、通用性等特点。[10]在发展过程中，HTML5从根本上改变了IT公司开发Web应用的方式，无论是电脑端应用还是移动端应用，在开发过程中都需要用到此技术。[11]截至2023年，HTML5的主要版本有IE、Chrome、Firefox、Safari和Opera，同时随着科技的发展，谷歌、亚马逊、You Tube等大型互联网公司已经开始关注HTML5。[12]
发展历史
HTML +
1980年，物理学家蒂姆·伯纳斯-李在欧洲核子研究中心（CERN）在承包工程期间，为使CERN的研究人员使用并共享文档，他提出并创建原型系统ENQUIRE。1989年，伯纳斯-李在一份备忘录中提出一个基于互联网的超文本系统。他规定HTML并在1990年底写出浏览器和服务器软件。同年，伯纳斯-李与CERN的数据系统工程师罗伯特·卡里奥联合为项目申请资助，但未被CERN正式批准。在他的个人笔记中伯纳斯-李列举“一些使用超文本的领域”，并把百科全书列为首位。[13]
HTML最早源于SGML，它由蒂姆·伯纳斯·李和其同事Daniel W.Connolly（丹尼尔·康诺利）于1990年创立。[2]HTML的首个公开描述出现于1991年，是由蒂姆·伯纳斯-李编写了一份叫做“HTML 标签”的文档，里面包含了大约 20个用来标记网页的HTML标签。[14]HTML最初的版本并不存在HTML 1，在1993年IETF（互联网工程任务组）团队的一个草案，并非成型的标准，[3]被称为“HTML+”，最初是被设计成为“HTML 的一个超集”。[15]
HTML 2和HTML 3
在1995年，HTML 2.0版本发布，当时是作为RFC1866发布的，[3]1995年3月，万维网联盟提出HTML 3.0规范，其提供了很多新的特性，例如表格文字绕排和复杂数学元素的显示。虽然它是被设计用来兼容 2.0 版本的，但由于实现起来过于复杂，在草案于1995年9月过期时，标准开发也因为缺乏浏览器支持而中止了。3.1 版从未被正式提出。1997年1月14日，HTML 3.2成为W3C推荐标准，在HTML3.2中，它去掉了大部分 3.0 中的新特性，加入了很多特定浏览器如 Netscape 和 Mosaic 的元素和属性。[7]
HTML 4
在1997年12月18日和1999年12月24日发布的4.0和4.01也相继成为W3C的推荐标准。[3][7]其中新版本同样也加人了很多特定浏览器的元素和属性，但是同时也开始“清理”这个标准，把一些元素和属性标记为过时，建议不再使用它们。[7]
而在 HTML4.01 版本发布的当年，W3C 对 HTML 未来的发展做了分析，他们认为 HTML 的形式与内容无法分离，且标记单一，前途堪忧。于是 W3C 转向语言更加规范的XML，但是从1991 年HTML 出现到 1999 年的8 年时间里，互联网上已经有成千上万由 HTML编写的网页，直接转向 XML 是不现实的，所以 W3C 只能放慢脚步，开始HTML到XML的过渡，因此出现了XHTML。[8]
XHTML
XHTML（eXtensible Hyper Text Markup Language，扩展的超文本标记语言）是一种在HTML 4.0基础上优化和改进的新语言，目的是基于XML应用。[2][16]同时它和HTML 4.01具有良好的兼容性，而且XHTML是更严格、更纯净的HTML代码。[16]
万维网联盟在2000年推出了XHTML 1.0，它以XML的语法重新整理了HTML 4.0，使其具有类似XML严谨的语法规则。[8]2001 年5月31日发布了XHTML1.1。[15]2002年继续推出了XHTML 2.0，但由于其没有反映出网站开发人员在网页上的交互操作，也未能将网页上已有的内容往后兼容等，最终XHTML 2.0宣告失败。[8]
HTML 5
HTML的前身名为Web Applications 1.0，由超文本应用技术工作小组（Web Hypertext Application Technology Working Group,简称WHATWG）在2004年提出，2007年被W3C接纳，随后W3C成立了由AOL、Apple、Google、IBM等数百个开发商组成的新的HTML工作团队，2009年，该团队公布了HTML 5正式草案，HTML 5成为HTML和HTMLDOM的新标准，2012年12月17日，W3C宣布HTML 5规范正式定稿。[2]
HTML 5在开发时就考虑到了后期的开发任务，因此它可以向后兼容，且包含了HTML 4.0的全部特性，并进行了少量的修改与改善。[8]2014年，W3C宣布，HTML 5制作完成并公开发布。[8]在HTML 5中，新增了article（文章）、aside（侧边）、footer（尾部）等语义化标签，这些新增的语义标签有利于搜索引擎优化，同时在高版本的浏览器及移动端中，不用考虑语义标签的兼容性。[17]在2014年10月28日，HTML 5也正式成为W3C推荐标准。[3]
重要版本
| 版本 | 发布年份 | 说明 |
|---|---|---|
| HTML+（首个版本） | 1993年6月 | 作为因特网工程组（IETF）工作草案发布（并非标准） |
| HTML 2.0 | 1995年11月 | 作为RFC1866发布，在RFC2854于2000年6月发布后被宣布已经过时 |
| HTML 3.2 | 1997年1月14日 | 万维网联盟（W3C）推荐标准 |
| HTML 4.0 | 1997年12月18日 | W3C推荐标准 |
| HTML 4.01 | 1999年12月24日 | 在HTML 4.0基础上的微小改进，W3C推荐标准 |
| HTML 5 | 2008年1月22日 | 首份正式草案于2008年1月22日发布，2014年10月29日完成最终定稿 |
参考文献：[10][18]
基本结构
以HTML的基本结构包括HTML的语法结构，文档结构、标签的格式以及代码的编写规范等。[2][9]
标签（Tag）
HTML文档由标签（“<”和">"括起来的单词或单词缩写）和受标签影响的内容（为字符串，用于描述网页文件内容的类型、组成和格式化信息）组成。标签能产生所需的各种效果，其功能类似于一个排版软件。标签通常由开始标签和结束标签组成，开始标签用“<标签>”表示，结束标签用“</标签>”表示，其格式为<标签>受标签影响的内容</标签>。[2][19]HTML 标签对大小写不敏感，但 W3C在 HTML4中开始推荐使用小写。[20]
HTML注释标签是一个特殊标签，它的格式为<!--在此处写注释-->，在开始标签中有一个感叹号，然后是两个减号，在结束标签中没有感叹号，浏览器并不会显示注释的内容，注释标记可以帮助设计者标注并理解HTML文档内容。[20]
| 标签名称 | 标签形式 | 功能说明 |
|---|---|---|
| html | 成对 | 表示整个HTML文档 |
| head | 成对 | 直接包含在<html>中，表示文档头 |
| body | 成对 | 直接包含在<html>中，表示文档体 |
| mate | 独立 | 位于<head>中，定义与文档相关的参数 |
| title | 成对 | 位于<head>中，表示文档的标题 |
| link | 独立 | 引用外部资源，关键属性为src（资源URL） |
| script | 成对 | 表示一段JavaScript代码 |
| style | 成对 | 表示一段CSS规则 |
| div | 成对 | 表示一个区块，没有具体语义 |
| p | 成对 | 表示一个段落 |
| br | 独立 | 表示在当前位置换行 |
| h1～h6 | 成对 | 分别表示一级标题到六级标题 |
| table | 成对 | 表示一个表格 |
| tr | 成对 | 表示表格中的一行 |
| td | 成对 | 表示表格中的一个单元格 |
| ul | 成对 | 表示一个无编号的列表 |
| li | 成对 | 表示一个列表项（通常包含在ul中） |
| form | 成对 | 表示一个表单 |
| input | 独立 | 表单元素（文本框、文件上传、提交按钮等） |
| select | 成对 | 表示一个选择列表 |
| option | 成对 | 表示一个选择项（通常包含在select中） |
| button | 成对 | 表示一个普通按钮 |
| a | 成对 | 表示超链接，关键属性为href（链接URL） |
| img | 独立 | 表示图片，关键属性为src（图片URL） |
| textarea | 成对 | 表示多行文本 |
| article | 成对 | 表示一篇文章（HTML5新增） |
| section | 成对 | 表示文档中的节（HTML5新增） |
| canvas | 成对 | 表示一个位图画布（HTML5新增） |
| svg | 成对 | 表示一个伸缩矢量图（HTML5新增） |
| audio | 成对 | 表示一个音频（HTML5新增） |
| video | 成对 | 表示一个视频（HTML5新增） |
参考文献：[21]
属性
标签通过属性来制作出各种效果，属性和属性值始终被包含在元素的开始标签中，且不能单独使用，通常都是以“属性名="值"”的形式来表示，用空格隔开后，还可以指定多个属性，并且在指定多个属性时不用区分顺序。其格式为<标签 属性1=“属性值1” 属性2=“属性值2” ...>受标签影响的内容</标签>。[2][19]
在HTML5中，很多元素会重复出现，为了区分重复元素，可以在开始标签中使用ID属性给每一个元素定义一个唯一的标识，ID属性的属性值在文件中也必须是唯一的。[19]
HTML中的全局属性对任何HTML元素有效，常用的全局属性为：[20]
| 全局属性 | 描述 | 示例 |
|---|---|---|
| class | 规定元素的类名 | <div class='note_1'></div> |
| id | 规定元素的唯一ID | <img id='zhangsan'src='a.jpg'/> |
| style | 规定元素的行内样式（inline style） | <body style='font-size:12px'> |
| title | 规定元素的额外信息（可在工具提示中显示） | <img title='张三的照片'src=‘a.jpg’/> |
| tabindex | 规定元素的Tab键次序 | <input type=''tabindex='2'> |
| accesskey | 规定激活元素的快捷键 | <a href='login.do' accesskey='1'>登录</a> |
| contenteditable | 规定元素内容是否可以编辑 | <div contenteditable='true'></div> |
| hidden | 规定是否显示元素 | <div hiddlen='hidden'></div> |
| draggable | 规定元素是否可拖动 | <div draggable='true'></div> |
| data-* | 用于存储与元素 | <span data-value='200'></span> |
参考文献：[20]
元素
截至2020年，HTML5拥有120个元素，其中有10个不建议使用的元素。元素是指位于开始标签与结束标签之间包含在标签中在内的整体，它通过HTML5标签进行定义，是构建网页的基本结构，由标签和属性组成，元素可以嵌套但不能交叉。没有内容的HTML元素被称为空元素。空元素是在开始标签中关闭的。[2][19]元素的大体结构为<div class="main">元素内容</div>。[9]
按用途区分，HTML可分为文档结构元素、头部元素、列表元素、超链接元素等。[22]
| 类别 | 允许包含的元素 |
|---|---|
| 文档结构元素 | HTML、HEAD、BODY、FRAMESET |
| 头部元素 | TITLE、META、LINK、BASE、STYLE |
| 块元素 | CENTER、Hx、ADDRESS、PRE、PBR、DIV |
| 列表元素 | DIR、DL、DT、DD、LI、OL、UL |
| 表格元素 | TABLE、TR、TD、TH、CAPTION |
| 表单元素 | FORM、INPUT、SELECT、OPTION、TEXTAREA、MENU |
| 超链接元素 | A、MAP、AREA |
| 字符格式元素 | FONT、B、1、U、S、STRIKE、SMALL、BIG |
| 帧元素 | FRAMESET、FRAME、NOFRAME、IFRAME |
| 图片元素 | IMG |
| 层元素 | DIV、SPAN、LAYER、ILAYER |
| 脚本元素 | SCRIPT |
| 内嵌对象元素 | APPLET、OBJECT、PARAM、EMBED |
参考文献：[22]
编写规范
HTML的书写需满足HTML的相关规范。在HTML 4.0中主要用于在浏览器中星现富文本内容和实现超链接，HTML5 继承了这些特点但更侧重于在浏览器中实现 Web 应用程序。对于网页的制作，HTML5 主要有两方面的改进，即实现 Web 应用程序和更好地呈现内容。[2]
标签的规范
标签分单标签和双标签，双标签往往是成对出现的，所有标签（包括空标签）都必须关闭，如<br/>、<img>、<p>...</p>等。[2][19]标签名和属性建议都用小写字母。[2][19]多数HTML标签可以嵌套。但不允许交叉（例如HTML5）。[2][19]
属性的规范
根据需要可以使用该标签的所有属性，也可以只有其中的几个属性。在使用时，属性之间没有顺序。[2]属性值都要用双引号括起来。[2][19]并不是所有的标签都有属性，如换行标签就没有属性。[2]
元素的嵌套
块级元素可以包含行级元素或其他块级元素，但行级元素却不能包含块级元素，它只能包含其他行级元素。[2]有几个特殊的块级元素只能包含行级元素，不能再包含块级元素，这几个特殊的标签是：<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<p>、<dt>。[2]
代码的缩进
HTML 代码并不要求在书写时缩进，但为了文档的结构性和层次性，建议初学者在使用标记时首尾对齐，内部的内容向右缩进几格。[2]
文档类型
在编写HTML 5文档时，要求指定文档类型。文档类型用于向浏览器进行页面解析用的DTD（文档类型定义）文件。文档类型声明的格式为<! DOCTYPE html>，其中doctype是document type（文档类型）的简写，doctype声明须放在每一个HTML文档的最顶端，在所有代码和标签之前，若没有声明文档类型，浏览器将会使用怪异模式。[2][9]
HTML文档标签<html>...</html>
HTML文档标签的格式为<html>HTML文档的内容</html>，其中<html>处于文档的最前面，表示HTML文档的开始，即浏览器从<html>开始解释，直至</html>为止。[2]
HTML文档头标签<head>...</head>
HTML文档包括头部（head）和主体（body），其中文档头标签用于定义文件页眉，它是一种具有引导和导航作用的结构元素，其格式为<head>头部的内容</head>，文档头部内容在开始标签<html>和结束标签</html>之间，其内容可以是标题名或文本文件地址、创作信息等网页信息说明。[2][19]它本身不作为内容来显示，但影响网页显示的效果。[9]
HTML文档编码
为了被浏览器正确解释和通过 W3C 代码校验，所有的 HTML 文档都必须声明它们所使用的语言编码。文档声明的编码应该与实际的编码一致，否则就会呈现为乱码。UTF-8 是世界通用的HTML语言编码，用户一般使用UTF-8 来指定文档编码。其中HTML5文档直接使用meta元素的charset 属性指定文档编码，格式为<meta charset="uTF-8">。[2]
HTML文档主体标签<body>...</body>
HTML文档主体标签格式为<body>网页的内容</body>。主体位于头部之后，以<body>为开始标签，</body>为结束标签。它定义网页上显示的主要内容与显示格式，是整个网页的核心。[2]用户可以通过浏览器看到写在主体标签间的内容。[9]
编辑器
HTML其实就是文本，它需要浏览器的解释，它的编辑软件大体可以分为以下3种。[7][9]
基本文本文档编辑软件：使用 Windows自带的记事本或写字板程序就可以编写，不过保存时需要使用.htm 或.html作为扩展名，这样方便浏览器直接运行。[7][9]
半所见即所得软件：这种软件能大大提高开发效率，让制作者在很短的时间内制作出主页，且可以学习HTML，这种类型的软件主要有网页作坊、Amaya和HOTDOG等。[7][9]
所见即所得软件：使用最广泛的编辑软件，即使用户完全不懂HTML的知识，也可以制作出网页，这类软件有Dreamweaver等。与半所见即所得软件相比，这类软件开发速度更快，效率更高，且直观表现力更强，对任何地方进行修改只需要刷新即可。[7][9]
分发方式
当Web 服务器计算机通过 Internet 发送 Web 页时，使用HTTP(Hypertext TransferProtocol，超文本传输协议) 信息交换标准。然而，把页面上传到 Web 站点时，需要的软件通常使用比较老的通信标准，叫做 FTP(File Transfer Protocol，文件传输协议)。[23]
它可以通过Netscape、Microsoft IE、Microsoft FrontPage和CuteFTP来发送页面，这些软件中，Microsoft FrontPage适用于开发复杂的 Web 站点，帮助管理页面之间的链接更改，自动跟踪哪个页面已经改变及哪个页面需要更新，节省用户许多时间。CuteFTP适用于刚入门的 Web 页作者和只计划有几个个人页面或企业贞面的中型站点。若用户仅仅想要使第1个页面在线，根本不打算装配任何新的软件，可以使用IE或Netscape 完成工作。[23]
HTML的语言特点
简易性：HTML版本升级采用超集方式，从而更加灵活方便。[10]
可扩展性：HTML 的广泛应用带来了加强功能，增加标识符等要求，HTML 采取子类元素的方式，为系统扩展带来保证。[10]
平台无关性：虽然个人计算机系统比较多，包括 Windows、Linux、Mac、Android 等，HTML可以使用在广泛的平台上。[10]
通用性：HTML 是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作者建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的计算机或浏览器。[10]
发展趋势
HTML5从根本上改变了IT公司开发Web应用的方式，无论是电脑端应用还是移动端应用，在开发过程中都需要用到此技术。[11]
截至2023年，HTML5的主要的浏览器版本有IE、Chrome、Firefox、Safari和Opera，其他如谷歌、亚马逊、You Tube等公司已经开始关注HTML5并开始逐步使用其作为自己的开发工具。[12]在多种网络编程语言兴起的时候，HTMI5必须能够尽可能多地兼容这些语言，并提供一个良好的编程环境。因此，简洁的界面和良好的交成了发展的重点。同时与CSS 的结合将非常关键。[20]此外，HTML5正在不断推进移动互联网向更加开放融合的Web云服务模式转变。[11]
差异性
| 语言名称 | 代码块 | 简介 |
|---|---|---|
| XML |  | 可扩展标记语言（extensible markup language，XML）是一种与HTML类似的标记语言，其设计宗旨是传输数据，而不是显示数据，而HTML是为了在浏览器上显示数据。与HTML相比，XML用于标记电子文件，使其具有结构性，可用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。XML是一种简单、与平台无关，并被广泛采用的标准。XML相对于HTML的优点是它将用户界面与结构化数据分隔开来。这种数据与显示的分离使得集成来自不同源的数据成为可能。客户信息、订单、研究结果、账单付款、病历、目录数据及其他信息都可以转换为XML。XML不是要替换HTML，而是对HTML的补充。XML标记由文档的作者定义，并且是无限制的。HIML标记则是预定义的[4] |
| CSS |  | 层叠样式表（cascading style sheets，CSS）是一种样式表语言，用于为HTML文档定义布局。CSS与HTML的区别就是HTML用于结构化内容，而CSS用于格式化、结构化内容。例如，在浏览器上显示的字体、颜色、边距、高度、宽度、背景图像等，都能够给出精确的规定。现在所有的浏览器都支持CSS[4] |
| JavaScript |  | JavaScript（简称“JS”）是一种轻量级的脚本语言，广泛应用于 Web 前端，能够运行在几乎所有的浏览器上。JavaScript不仅能够按照 DOM 标准访页面元素，还可以通过AJAX技术实现对Web 资源的异步加载 |
参考资料 23
- 参考 1
- 参考 2
- 参考 3
- 参考 4
- 参考 5
- 参考 6
- 参考 7
- 参考 8
- 参考 9
- 参考 10
- 参考 11
- 参考 12
- Information Management: A Proposal — CERN Document Server
- 参考 14
- 参考 15
- 参考 16
- 参考 17
- 参考 18
- 参考 19
- 参考 20
- 参考 21
- 参考 22
- 参考 23