HTML 发展史

HTML（HyperText Markup Language）从简单的文档标记语言发展到现代 Web 开发的基石，经历了多个重要阶段。

一、前 Web 时代 (1989-1991)

诞生背景

• 1989年：Tim Berners-Lee 在 CERN 提出 Web 概念
• 目标：创建链接文档系统，方便科学家共享研究信息

第一版 HTML

<!-- 最早的 HTML 文档示例 -->
<TITLE>我的第一个网页</TITLE>
<H1>欢迎来到万维网</H1>
<P>这是一个<A HREF="another.html">链接</A>到其他文档的例子。

二、HTML 2.0 (1995)

标准化进程

• 1995年11月：作为 RFC 1866 发布
• 首个官方标准：由 IETF 制定

主要特性

新增元素：<form>, <input>, <select>, <textarea>

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<HTML>
<HEAD>
    <TITLE>HTML 2.0 示例</TITLE>
</HEAD>
<BODY>
    <H1>标题</H1>
    <P>段落文本</P>
    <UL>
        <LI>无序列表项</LI>
    </UL>
    <FORM ACTION="/submit" METHOD="POST">
        <INPUT TYPE="TEXT" NAME="username">
        <INPUT TYPE="SUBMIT" VALUE="提交">
    </FORM>
</BODY>
</HTML>

三、HTML 3.2 (1997)

W3C 接管

• 1997年1月：W3C 发布 HTML 3.2
• 特性：引入表格、Applet、字体控制等

<TABLE BORDER="1">
    <TR>
        <TD>单元格1</TD>
        <TD>单元格2</TD>
    </TR>
</TABLE>

<APPLET CODE="MyApplet.class" WIDTH="300" HEIGHT="200">
</APPLET>

<FONT FACE="Arial" SIZE="3" COLOR="red">红色文本</FONT>

四、HTML 4.01 (1999)

重要里程碑

• 1999年12月：发布 HTML 4.01
• 核心理念：分离结构与表现

三个变体

<!-- 严格型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

<!-- 过渡型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<!-- 框架集型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
    "http://www.w3.org/TR/html4/frameset.dtd">

主要改进

<!-- 引入 CSS -->
<LINK REL="stylesheet" TYPE="text/css" HREF="style.css">

<!-- 脚本支持 -->
<SCRIPT TYPE="text/javascript">
    function validateForm() {
        // JavaScript 代码
    }
</SCRIPT>

<!-- 框架 -->
<FRAMESET COLS="20%,80%">
    <FRAME SRC="menu.html">
    <FRAME SRC="content.html">
</FRAMESET>

五、XHTML 1.0 (2000)

XML 化改革

• 2000年1月：基于 XML 的重新定义
• 目标：更严格、更规范

语法要求

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>XHTML 示例</title>
</head>
<body>
    <!-- 所有标签必须小写 -->
    <p>这是一个段落</p>
    
    <!-- 所有属性必须加引号 -->
    <img src="image.jpg" alt="描述" />
    
    <!-- 所有标签必须闭合 -->
    <br />
    <hr />
    
    <!-- 正确嵌套 -->
    <p><strong>粗体文本</strong></p>
</body>
</html>