HTML的全称为超文本标记语言 （HyperText Markup Language），是用来描述网页的一种语言，是由W3C（World Wide Web Consortium，万维网联盟）推荐发布的通用国际标准。不同于 C++、Python 等编程语言，HTML 是一种标记语言，由一套标记标签（markup tag）构成的。HTML 使用标记标签来描述网页。在纯文本文件中包含了HTML 的指令代码，在 HTML 中，每个标签（Tag）都是一条指令，用来告诉浏览器如何将图片、声音、文字、影像等在页面中显示出来。HTML文档又称为 Web 页面。
发展历史
编辑
HTML发展历程
HTML +
1980年，物理学家蒂姆·伯纳斯-李在欧洲核子研究中心（CERN）在承包工程期间，为使CERN的研究人员使用并共享文档，他提出并创建原型系统ENQUIRE。1989年，伯纳斯-李在一份备忘录中提出一个基于互联网的超文本系统。他规定HTML并在1990年底写出浏览器和服务器软件。同年，伯纳斯-李与CERN的数据系统工程师罗伯特·卡里奥联合为项目申请资助，但未被CERN正式批准。在他的个人笔记中伯纳斯-李列举“一些使用超文本的领域”，并把百科全书列为首位。
HTML最早源于SGML，它由蒂姆·伯纳斯·李和其同事Daniel W.Connolly（丹尼尔·康诺利）于1990年创立。HTML的首个公开描述出现于1991年，是由蒂姆·伯纳斯-李编写了一份叫做“HTML 标签”的文档，里面包含了大约 20个用来标记网页的HTML标签。HTML最初的版本并不存在HTML 1，在1993年IETF（互联网工程任务组）团队的一个草案，并非成型的标准，被称为“HTML+”，最初是被设计成为“HTML 的一个超集”。
HTML 2和HTML 3
在1995年，HTML 2.0版本发布，当时是作为RFC1866发布的，1995年3月，万维网联盟提出HTML 3.0规范，其提供了很多新的特性，例如表格文字绕排和复杂数学元素的显示。虽然它是被设计用来兼容 2.0 版本的，但由于实现起来过于复杂，在草案于1995年9月过期时，标准开发也因为缺乏浏览器支持而中止了。3.1 版从未被正式提出。1997年1月14日，HTML 3.2成为W3C推荐标准，在HTML3.2中，它去掉了大部分 3.0 中的新特性，加入了很多特定浏览器如 Netscape 和 Mosaic 的元素和属性。
HTML 4
在1997年12月18日和1999年12月24日发布的4.0和4.01也相继成为W3C的推荐标准。其中新版本同样也加人了很多特定浏览器的元素和属性，但是同时也开始“清理”这个标准，把一些元素和属性标记为过时，建议不再使用它们。
而在 HTML4.01 版本发布的当年，W3C 对 HTML 未来的发展做了分析，他们认为 HTML 的形式与内容无法分离，且标记单一，前途堪忧。于是 W3C 转向语言更加规范的XML，但是从1991 年HTML 出现到 1999 年的8 年时间里，互联网上已经有成千上万由 HTML编写的网页，直接转向 XML 是不现实的，所以 W3C 只能放慢脚步，开始HTML到XML的过渡，因此出现了XHTML。
XHTML
XHTML（eXtensible Hyper Text Markup Language，扩展的超文本标记语言）是一种在HTML 4.0基础上优化和改进的新语言，目的是基于XML应用。同时它和HTML 4.01具有良好的兼容性，而且XHTML是更严格、更纯净的HTML代码。
万维网联盟在2000年推出了XHTML 1.0，它以XML的语法重新整理了HTML 4.0，使其具有类似XML严谨的语法规则。2001 年5月31日发布了XHTML1.1。2002年继续推出了XHTML 2.0，但由于其没有反映出网站开发人员在网页上的交互操作，也未能将网页上已有的内容往后兼容等，最终XHTML 2.0宣告失败。
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规范正式定稿。
HTML 5在开发时就考虑到了后期的开发任务，因此它可以向后兼容，且包含了HTML 4.0的全部特性，并进行了少量的修改与改善。2014年，W3C宣布，HTML 5制作完成并公开发布。在HTML 5中，新增了article（文章）、aside（侧边）、footer（尾部）等语义化标签，这些新增的语义标签有利于搜索引擎优化，同时在高版本的浏览器及移动端中，不用考虑语义标签的兼容性。在2014年10月28日，HTML 5也正式成为W3C推荐标准。
重要版本
编辑|
版本 |
发布年份 |
说明 |
|
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日完成最终定稿 |
参考文献：
基本结构
编辑以HTML的基本结构包括HTML的语法结构，文档结构、标签的格式以及代码的编写规范等。
语法结构
标签（Tag）
HTML文档由标签（“<”和">"括起来的单词或单词缩写）和受标签影响的内容（为字符串，用于描述网页文件内容的类型、组成和格式化信息）组成。标签能产生所需的各种效果，其功能类似于一个排版软件。标签通常由开始标签和结束标签组成，开始标签用“<标签>”表示，结束标签用“</标签>”表示，其格式为<标签>受标签影响的内容</标签>。HTML 标签对大小写不敏感，但 W3C在 HTML4中开始推荐使用小写。
HTML注释标签是一个特殊标签，它的格式为<!--在此处写注释-->，在开始标签中有一个感叹号，然后是两个减号，在结束标签中没有感叹号，浏览器并不会显示注释的内容，注释标记可以帮助设计者标注并理解HTML文档内容。
开始标签（Opening tag）、结束标签（Closing tag）、内容（Content）和元素（Element）
常用HTML标签
|
标签名称 |
标签形式 |
功能说明 |
|
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新增） |
参考文献：
属性
标签通过属性来制作出各种效果，属性和属性值始终被包含在元素的开始标签中，且不能单独使用，通常都是以“属性名="值"”的形式来表示，用空格隔开后，还可以指定多个属性，并且在指定多个属性时不用区分顺序。其格式为<标签 属性1=“属性值1” 属性2=“属性值2” ...>受标签影响的内容</标签>。
在HTML5中，很多元素会重复出现，为了区分重复元素，可以在开始标签中使用ID属性给每一个元素定义一个唯一的标识，ID属性的属性值在文件中也必须是唯一的。
注：class 是属性名称，editor-note 是属性的值。class 属性可为元素提供一个标识名称，以便进一步为元素指定样式或进行其他操作时使用。
HTML中的全局属性对任何HTML元素有效，常用的全局属性为：
|
全局属性 |
描述 |
示例 |
|
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> |
参考文献：
元素
截至2020年，HTML5拥有120个元素，其中有10个不建议使用的元素。元素是指位于开始标签与结束标签之间包含在标签中在内的整体，它通过HTML5标签进行定义，是构建网页的基本结构，由标签和属性组成，元素可以嵌套但不能交叉。没有内容的HTML元素被称为空元素。空元素是在开始标签中关闭的。元素的大体结构为<div class="main">元素内容</div>。
按用途区分，HTML可分为文档结构元素、头部元素、列表元素、超链接元素等。
|
类别 |
允许包含的元素 |
|
文档结构元素 |
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 |
参考文献：
编写规范
HTML的书写需满足HTML的相关规范。在HTML 4.0中主要用于在浏览器中星现富文本内容和实现超链接，HTML5 继承了这些特点但更侧重于在浏览器中实现 Web 应用程序。对于网页的制作，HTML5 主要有两方面的改进，即实现 Web 应用程序和更好地呈现内容。
HTML代码
标签的规范
-
标签分单标签和双标签，双标签往往是成对出现的，所有标签（包括空标签）都必须关闭，如<br/>、<img>、<p>...</p>等。
-
标签名和属性建议都用小写字母。
-
多数HTML标签可以嵌套。但不允许交叉（例如HTML5）。
属性的规范
-
根据需要可以使用该标签的所有属性，也可以只有其中的几个属性。在使用时，属性之间没有顺序。
-
属性值都要用双引号括起来。
-
并不是所有的标签都有属性，如换行标签就没有属性。
元素的嵌套
-
块级元素可以包含行级元素或其他块级元素，但行级元素却不能包含块级元素，它只能包含其他行级元素。
-
有几个特殊的块级元素只能包含行级元素，不能再包含块级元素，这几个特殊的标签是：<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<p>、<dt>。
代码的缩进
HTML 代码并不要求在书写时缩进，但为了文档的结构性和层次性，建议初学者在使用标记时首尾对齐，内部的内容向右缩进几格。
文档结构
文档类型
在编写HTML 5文档时，要求指定文档类型。文档类型用于向浏览器进行页面解析用的DTD（文档类型定义）文件。文档类型声明的格式为<! DOCTYPE html>，其中doctype是document type（文档类型）的简写，doctype声明须放在每一个HTML文档的最顶端，在所有代码和标签之前，若没有声明文档类型，浏览器将会使用怪异模式。
HTML文档标签<html>...</html>
HTML文档标签的格式为<html>HTML文档的内容</html>，其中<html>处于文档的最前面，表示HTML文档的开始，即浏览器从<html>开始解释，直至</html>为止。
HTML文档头标签<head>...</head>
HTML文档包括头部（head）和主体（body），其中文档头标签用于定义文件页眉，它是一种具有引导和导航作用的结构元素，其格式为<head>头部的内容</head>，文档头部内容在开始标签<html>和结束标签</html>之间，其内容可以是标题名或文本文件地址、创作信息等网页信息说明。它本身不作为内容来显示，但影响网页显示的效果。
HTML文档编码
为了被浏览器正确解释和通过 W3C 代码校验，所有的 HTML 文档都必须声明它们所使用的语言编码。文档声明的编码应该与实际的编码一致，否则就会呈现为乱码。UTF-8 是世界通用的HTML语言编码，用户一般使用UTF-8 来指定文档编码。其中HTML5文档直接使用meta元素的charset 属性指定文档编码，格式为<meta charset="uTF-8">。
HTML文档主体标签<body>...</body>
HTML文档主体标签格式为<body>网页的内容</body>。主体位于头部之后，以<body>为开始标签，</body>为结束标签。它定义网页上显示的主要内容与显示格式，是整个网页的核心。用户可以通过浏览器看到写在主体标签间的内容。
编辑器
编辑HTML其实就是文本，它需要浏览器的解释，它的编辑软件大体可以分为以下3种。
基本文本文档编辑软件：使用 Windows自带的记事本或写字板程序就可以编写，不过保存时需要使用.htm 或.html作为扩展名，这样方便浏览器直接运行。
半所见即所得软件：这种软件能大大提高开发效率，让制作者在很短的时间内制作出主页，且可以学习HTML，这种类型的软件主要有网页作坊、Amaya和HOTDOG等。
所见即所得软件：使用最广泛的编辑软件，即使用户完全不懂HTML的知识，也可以制作出网页，这类软件有Dreamweaver等。与半所见即所得软件相比，这类软件开发速度更快，效率更高，且直观表现力更强，对任何地方进行修改只需要刷新即可。
分发方式
编辑当Web 服务器计算机通过 Internet 发送 Web 页时，使用HTTP(Hypertext TransferProtocol，超文本传输协议) 信息交换标准。然而，把页面上传到 Web 站点时，需要的软件通常使用比较老的通信标准，叫做 FTP(File Transfer Protocol，文件传输协议)。
它可以通过Netscape、Microsoft IE、Microsoft FrontPage和CuteFTP来发送页面，这些软件中，Microsoft FrontPage适用于开发复杂的 Web 站点，帮助管理页面之间的链接更改，自动跟踪哪个页面已经改变及哪个页面需要更新，节省用户许多时间。CuteFTP适用于刚入门的 Web 页作者和只计划有几个个人页面或企业贞面的中型站点。若用户仅仅想要使第1个页面在线，根本不打算装配任何新的软件，可以使用IE或Netscape 完成工作。
HTML的语言特点
编辑简易性：HTML版本升级采用超集方式，从而更加灵活方便。
可扩展性：HTML 的广泛应用带来了加强功能，增加标识符等要求，HTML 采取子类元素的方式，为系统扩展带来保证。
平台无关性：虽然个人计算机系统比较多，包括 Windows、Linux、Mac、Android 等，HTML可以使用在广泛的平台上。
通用性：HTML 是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作者建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的计算机或浏览器。
发展趋势
编辑HTML5从根本上改变了IT公司开发Web应用的方式，无论是电脑端应用还是移动端应用，在开发过程中都需要用到此技术。
截至2023年，HTML5的主要的浏览器版本有IE、Chrome、Firefox、Safari和Opera，其他如谷歌、亚马逊、You Tube等公司已经开始关注HTML5并开始逐步使用其作为自己的开发工具。在多种网络编程语言兴起的时候，HTMI5必须能够尽可能多地兼容这些语言，并提供一个良好的编程环境。因此，简洁的界面和良好的交成了发展的重点。同时与CSS 的结合将非常关键。此外，HTML5正在不断推进移动互联网向更加开放融合的Web云服务模式转变。
差异性
编辑|
语言名称 |
代码块 |
简介 |
|
XML |
XML代码 | 可扩展标记语言（extensible markup language，XML）是一种与HTML类似的标记语言，其设计宗旨是传输数据，而不是显示数据，而HTML是为了在浏览器上显示数据。与HTML相比，XML用于标记电子文件，使其具有结构性，可用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。XML是一种简单、与平台无关，并被广泛采用的标准。XML相对于HTML的优点是它将用户界面与结构化数据分隔开来。这种数据与显示的分离使得集成来自不同源的数据成为可能。客户信息、订单、研究结果、账单付款、病历、目录数据及其他信息都可以转换为XML。XML不是要替换HTML，而是对HTML的补充。XML标记由文档的作者定义，并且是无限制的。HIML标记则是预定义的 |
|
CSS |
CSS代码 | 层叠样式表（cascading style sheets，CSS）是一种样式表语言，用于为HTML文档定义布局。CSS与HTML的区别就是HTML用于结构化内容，而CSS用于格式化、结构化内容。例如，在浏览器上显示的字体、颜色、边距、高度、宽度、背景图像等，都能够给出精确的规定。现在所有的浏览器都支持CSS |
|
JavaScript |
JavaScript代码 | JavaScript（简称“JS”）是一种轻量级的脚本语言，广泛应用于 Web 前端，能够运行在几乎所有的浏览器上。JavaScript不仅能够按照 DOM 标准访页面元素，还可以通过AJAX技术实现对Web 资源的异步加载 |
参考资料
编辑展开[1]赵洪华, 许博, 王真主编, 谢钧, 陈涵, 张文宇副主编. 面向新工科普通高等教育系列教材 Web前端开发技术与案例教程[M]. 北京: 机械工业出版社, 2022.10: 3.
[2]刘瑞新, 张兵义, 朱立编著. HTML+CSS+JavaScript网页制作 Web前端开发 第3版[M]. 北京: 机械工业出版社, 2022.08: 5-8. (4)
[3]朱三元. Web前端设计 HTML5+CSS3+JS+jQuery[M]. 北京: 北京邮电大学出版社, 2021.01: 9.
[4]高福祥, 刘铮. 互联网技术[M]. 沈阳: 东北大学出版社, 2021.09: 212-215. (4)
[5]林建兵主编. Python程序设计应用教程[M]. 厦门: 厦门大学出版社, 2020.12: 145.
[6]陈童, 李颖, 王妍主编. 移动Web前端开发基础[M]. 北京: 中国铁道出版社, 2020.01: 23.
[7]徐云晴主编, 琚敏敏, 李永明, 毛燕, 谈李清等副主编. 网页设计与制作项目教程：HTML＋CSS＋BOOTSTRAP 第2版[M]. 北京: 北京理工大学出版社, 2021.11: 36-38. (3)
[8]袁明兰, 王华, 郦丽华主编. HTML5+CSS3项目开发案例教程[M]. 上海: 上海交通大学出版社, 2020: 3.
[9]赵志建, 蒋继冬. Web前端开发基础[M]. 苏州: 苏州大学出版社, 2022.03: 4-7. (4)
[10]吕云翔, 欧阳植昊, 张远编. HTML+CSS+JavaScript前端开发基础[M]. 北京: 机械工业出版社, 2022.08: 11-12. (2)
[11]周春吟. HTML5与CSS 3在Web前端开发中的应用研究[J]. 信息与电脑(理论版), 2021, 33(21): 32-34.
[12]邹晓丹. 基于HTML5和CSS3的网页前端设计优化研究[J]. 自动化应用, 2023, 64(S1): 217-219.
[13]Information Management: A Proposal.CERN Document Server. [2024-01-22].
[14]杨松主编. 网页设计案例教程[M]. 北京: 航空工业出版社, 2015.08: 23.
[15]张星云主编, 张秋生, 韩桂华, 李翠琳, 杨琴副主编. HTML CSS和JavaScript实训教程[M]. 武汉: 武汉大学出版社, 2016.06: 6-7. (2)
[16]库波主编, 汪晓青, 徐佳, 刘蕴副主编. HTML5与CSS3网页设计 第2版[M]. 北京: 北京理工大学出版社, 2021: 8.
[17]鲍小忠. 普通高等教育十四五规划教材 Web前端开发基础 HTML+CSS+JavaScript》[M]. 中国铁道出版社, 2021-09-01: 79-80. (2)
[18]吴英宾, 王琰琰主编. HTML5应用开发案例教程[M]. 北京: 机械工业出版社, 2021.01: 2-4. (3)
[19]陈敏, 罗迪, 杨文艺. Dreamweaver CS6网页设计与制作教程[M]. 西安: 西安电子科学技术大学出版社, 2020.08: 34-37. (4)
[20]朱三元. Web前端设计 HTML5+CSS3+JS+jQuery[M]. 北京: 北京邮电大学出版社, 2021.01: 10-11. (2)
[21]李健, 种慧芳著. 网络爬虫原理与实践 基于C#语言[M]. 北京: 机械工业出版社, 2023.01: 14-17. (4)
[22]张磊编著. 网页设计技术[M]. 北京: 中国铁道出版社, 2010.12: 23.
[23]（美）Dick Oliver著, 孙宝成等译. 循序渐进HTML与XHTML教程[M]. 北京: 人民邮电出版社, 2001.11: 43-45. (3)
该页面最新编辑时间为 2024年4月4日
走词作者：走词先生，如若转载，请注明出处：https://zouci.cc/42979/