下载掌阅APP，畅读海量书库
立即打开
HTML是目前在网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML文档是由HTML标签组成的描述性文本，HTML标签可以标识文字、图形、动画、声音、表格、链接等。
HTML作为一种网页内容标识语言，易学易懂，熟悉使用该语言可以制作功能强大、美观大方的网页。HTML语言的主要作用说明如下：
使用HTMl语言标识文本。例如，定义标题文本、段落文本、列表文本、预定义文本等。
使用HTML语言建立超链接，通过超链接可以访问互联网上的所有信息，当使用鼠标单击超链接时，会自动跳转到链接页面。
使用HTML语言创建列表，把信息有序地组织在一起，以方便浏览。
使用HTMl语言在网页中显示图像、声音、视频、动画等多媒体信息，把网页设计得更富冲击力。
使用HTML语言可以制作表格，以方便显示大量数据。
使用HTML语言制作表单，允许在网页内输入文本信息，执行其他用户操作，方便信息互动。
HTML文档一般都应包含两部分：头部区域和主体区域。HTML文档基本结构由3个标签负责组织：<html>、<head>和<body>。其中<html>标签标识HTML文档，<head>标签标识头部区域，而<body>标签标识主体区域。一个完整的HTML文档基本结构如下：
可以看到，每个标签都是成对组成，第一个标签（如<html>）表示标识的开始位置，而第二个标签（如</html>）表示标识的结束位置。<html>标签包含<head>和<body>标签，而<head>和<body>标签是并列排列。
如果把上面字符代码放置在文本文件中，然后另存为“test.html”，就可以在浏览器中浏览了。当然，由于这个简单的HTML文档还没有包含任何信息，所以在浏览器中是看不到任何显示内容的。
编写HTML文档时，必须遵循HTML语法规范。HTML文档实际上就是一个文本文件，它由标签和信息混合组成，当然这些标签和信息必须遵循一定的组合规则，否则浏览器是无法解析的。
HTML语言的规范条文不多，相信读者也很容易理解。从逻辑上分析，这些标签包含的内容就表示一类对象，也可以称为网页元素。从形式上分析，这些网页元素通过标签进行分隔，然后表达一定的语义。很多时候，我们把网页标签和网页元素混为一团，而实际上，网页文档就是由元素和标签组成的容器。
所有标签都包含在“<”和“>”起止标识符中，构成一个标签。例如，<style>、<head>、<body>和<div>等。
在HTML文档中，绝大多数元素都有起始标签和结束标签，在起始标签和结束标签之间包含的是元素主体。例如，<body>和</body>中间包含的就是网页内容主体。
起始标签包含元素的名称，以及可选属性，也就是说元素的名称和属性都必须在起始标签中。结束标签以反斜杠开始，然后附加上元素名称。例如：
<tag>元素主体</tag>
元素的属性包含属性名称和属性值两部分，中间通过等号进行连接，多个属性之间通过空格进行分隔。属性与元素名称之间也是通过空格进行分隔。例如：
<tag a1="v1" a2="v2" a3="v3" …… an="vn">元素主体</tag>
少数元素的属性也可能不包含属性值，仅包含一个属性名称。例如：
<tag a1 a2 a3 …… an>元素主体</tag>
一般属性值应该包含在引号内，虽然不加引号，浏览器也能够解析，但是读者应该养成良好的习惯。
属性是可选的，元素包含多少个属性，也是不确定的，这主要根据不同元素而定。不同的元素会包含不同的属性。HTML也为所有元素定义了公共属性，如title、id、class、style等。
虽然大部分标签都是成对出现，但是也有少数标签不是成对的，这些孤立的标签，被称为空标签。空标签仅包含起始标签，没有结束标签。例如：
<tag>
同样，空标签也可以包含很多属性，用来标识特殊效果或者功能，例如：
<tag a1="v1" a1="v1" a2="v2" …… an="vn">
标签可以相互嵌套，形成文档结构。嵌套必须匹配，不能交错嵌套，例如，<div><span></div></span>。合法的嵌套应该是包含或被包含的关系，例如，<div><span></span> </div>或<span><div></div></span>。
HTML文档所有信息必须包含在<html>标签中，所有文档元信息应包含在<head>子标签中，而HTML传递信息和网页显示内容应包含在<body>子标签中。
对于HTML文档来说，除了必须符合基本语法规范外，还必须保证文档结构信息的完整性。完整文档结构如下所示。
HTML文档应主要包括如下内容。
必须在首行定义文档的类型，过渡型文档可省略。
<html>标签应该设置文档名字空间，过渡型文档可省略。
必须定义文档的字符编码，一般使用<meta>标签在头部定义，常用字符编码包括中文简体（gb2312）、中文繁体（big5）和通用字符编码（utf-8）。
应该设置文档的标题，可以使用<title>标签在头部定义。
HTML文档扩展名为.htm或.html，保存时必须正确使用扩展名，否则浏览器无法正确地解析。如果要在HTML文档中增加注释性文本，则可以在“<!--”和“-->”标识符之间增加，例如：
<!-- 单行注释-->
或
<!-----------------多行注释----------------->
HTML定义的标签很多，下面对常用标签进行说明，随着读者学习不断深入，相信会完全掌握HTML所有标签的用法和使用技巧。
文档结构标签主要用来标识文档的基本结构，主要标签说明如下。
<html>...</html>：标识HTML文档的起始和终止。
<head>...</head>：标识HTML文档的头部区域。
<body>...</body>：标识HTML文档的主体区域。
【示例1】 设计最简单的网页文档。
文本格式标签主要用来标识文本区块，并附带一定的显示格式，主要标签说明如下。
<title>...</title>：标识网页标题。
<hi>...</hi>：标识标题文本，其中i表示1、2、3、4、5、6，分别表示一级、二级、三级等标题。
<p>...</p>：标识段落文本。
<pre>...</pre>：标识预定义文本。
<blockquote>...</blockquote>：标识引用文本。
【示例2】 分别使用<h1>和<p>标签标识网页标题和段落文本。
字符格式标签主要用来标识部分文本字符的语义，很多字符标签可以呈现一定的显示效果。例如，加粗显示、斜体显示或者下划线显示等。主要标签说明如下。
<b>...</b>：标识强调文本，以加粗效果显示。
<i>...</i>：标识引用文本，以斜体效果显示。
<blink>...</blink>：标识闪烁文本，以闪烁效果显示。IE浏览器不支持该标签。
<big>...</big>：标识放大文本，以放大效果显示。
<small>...</small>：标识缩小文本，以缩小效果显示。
<sup>...</sup>：标识上标文本，以上标效果显示。
<sub>...</sub>：标识下标文本，以下标效果显示。
<cite>...</cite>：标识引用文本，以引用效果显示。
【示例3】 分别使用各种字符格式标签显示一个数学方程式的解法。
在HTML文档中，列表结构可以分为两种类型：有序列表和无序列表。无序列表使用项目符号来标识列表，而有序列表则使用编号来标识列表的项目顺序。具体使用标签说明如下。
<ul>...</ul>：标识无序列表。
<ol>...</ol>：标识有序列表。
<li>...</li>：标识列表项目。
【示例4】 使用无序列表分别显示了一元二次方程求解有4种方法。
另外，还可以定义定义列表。定义列表是一种特殊的结构，它包括词条和解释两块内容。包含的标签说明如下。
<dl>...</dl>：标识定义列表。
<dt>...</dt>：标识词条。
<dd>...</dd>：标识解释。
【示例5】 使用定义列表显示两个成语的解释。
链接标签可以实现把多个网页联系在一起。主要结构如下。
<a>...</a>：标识超链接。
【示例6】 使用<a>标签定义一个超链接，单击该超链接可以跳转到百度首页。
<a>标签还可以定义锚点。锚点是一类特殊的超链接，它可以定位到网页中某个具体的位置。例如，在上面示例中单击超链接文本，就可以跳转到网页的底部。
多媒体标签主要用于引入外部多媒体文件，并进行显示。主要包括下面几个标签。
<img />：嵌入图像。
<embed>...</embed>：嵌入多媒体。
<object>...</object>：嵌入多媒体。
表格标签用来组织和管理数据，主要包括下面几个标签。
<table>...</table>：定义表格结构。
<caption>...</caption>：定义表格标题。
<th>...</th>：定义表头。
<tr>...</tr>：定义表格行。
<td>...</td>：定义表格单元格。
【示例7】 使用表格结构显示5行3列的数据集。
表单标签主要用来制作交互式表单，主要包括下面几个标签。
<form>...</form>：定义表单结构。
<input/>：定义文本域、按钮和复选框。
<textarea>...</textarea>：定义多行文本框。
<select>...</select>：定义下拉列表。
<option>...</option>：定义下拉列表中的选择项目。
【示例8】 分别定义单行文本框、多行文本框、复选框、单选按钮、下拉菜单和提交按钮的表单。
