1.3 HTML语言的基础知识

1．HTML语言概述

HTML是Hypertext Marked Language的缩写，即超文本标记语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。只有采用HTML制作的网页，浏览器才能正确地阅读和运行。

用HTML语言制作网页，一般有两种方法：一种是使用记事本之类的工具，输入HTML的源代码，然后保存为以.html或.htm为扩展名的网页文件；另一种是使用可视化的网页制作工具，根据用户的可视化操作自动生成HTML代码，如Dreamweaver、FrontPage等软件。

2．HTML文档基本结构

一个HTML文档是由一系列的元素和标记组成的，HTML用标记来规定元素的属性和它在文件中的位置。HTML文档的结构包括头部分（head）和正文主体部分（body）两大部分，其中头部分描述浏览器所需的信息，而主体部分则包含所要说明的具体内容。具体结构如下。

            <html>
                  <head>
                    头部信息
                  </head>
                  <body>
                    正文主体部分
                  </body>
            </html>

<html>标记用于HTML文档的最前面，用来标识HTML文档的开始，而</html>标记恰恰相反，它放在HTML文档的最后面，用来标识HTML文档的结束，这两个标记必须一起使用。

<head>和</head>标记构成HTML文档的开头部分，可以包含<title></title>、<script></script>等标记，这些标记都是描述HTML文档相关信息的标记。

<body></body>是HTML文档的主体部分，可包含<p></p>、<img>、<br>、<a></a>等标记，其内容将在浏览器窗口中显示出来。

提示

● 在HTML文档中，所有的标记都要用括号<>括起来，如<p>、<hr>。

● HTML标记不区分大小写。

● 标记中如果包含多个参数，各参数之间用空格分隔，参数位置不受限制。

3．HTML常用标记

（1）标题标记

格式：<title>网页的标题</title>

说明：该标记在<head></head>标记中，所包含的文字将出现在浏览器的标题栏上。

（2）主体标记

格式：<body bgcolor="页面背景颜色" background="背景图像" text="文本颜色">

              主体内容
              </body>

说明：包括所有主体内容，可以设置页面的背景颜色、背景图像、文字颜色等属性。

例如，将图像tx.jpg设置为网页背景图像，网页文字颜色为黑色。

<body background="tx.jpg" text="#000000">

主体内容

</body>

（3）段落标记

格式：<p align="对齐方式">段落文本</p>

说明：用来划分段落，在该标记中可以输入一段文字。

例如，将标题“倡议书”居中显示。

<p align="center">倡议书</p>

（4）换行标记

格式：<br>

说明：用来标记一个换行动作，换行后的内容与原内容仍属于同一段落。

（5）水平线标记

格式：<hr align="对齐方式" color="颜色" width="宽度" size="高度">

说明：在页面中插入一条水平线，通常用于分割文档。

例如，插入一条红色水平线，并居中显示。

<hr align="center" color="#ff0000">

（6）图像标记

格式：<img src="图像的URL" align="对齐方式" width="宽度" height="宽度" alt="替换文字">

说明：在页面中插入一幅图像。

例如，插入图像images文件夹中的tx.jpg，宽度和高度均为300像素，鼠标指向图像或图像不能正常浏览时提示“风景图片”。

<img src="images/tx.jpg" width="300" height="300" alt="风景图片">

（7）超链接标记

格式：<a href="目标文件的URL" target="目标属性">文本或图像</a>

说明：为标记中的文本或图像添加超链接目标，浏览网页时单击可打开指定的目标文件。

例如，为文本“新浪网”创建超链接到http://www.sina.com。

<a href="http://www.sina.com">新浪网</a>

（8）表格标记

表格标记由表格标记、行标记和单元格标记3部分组成。

● 表格标记

<table width="宽度" height="高度" align="对齐方式" border="边框宽度" cellpadding="单元格边距" cellspacing ="单元格间距">…</table>

● 行标记

<tr>…</tr>

● 单元格标记

<td rowspan="跨越行数" colspan ="跨越列数">…</td>

例如，创建一个如图1-26所示的表格，对应的源代码如下。

图1-26 表格

            <table width="300" height="95" border="1" cellpadding="0" cellspacing="0">
              <tr align="center">
                  <td >新闻</td> <td >体育</td> <td>音乐</td>
              </tr>
              <tr>
                  <td colspan="3" bgcolor="#FFCCFF">&nbsp;</td>
              </tr>
            </table>
上一章目录下一章