第6章 网页制作相关知识

1、信息学院公共教学部在在Internet中，应用最广泛的无中，应用最广泛的无疑为疑为World Wide Web了，无论是了，无论是Web应用还是开发，都应该对标记语言应用还是开发，都应该对标记语言HTML有一个基本的认识。有一个基本的认识。6.2 HTML语言语言HTML（Hyper Text Markup Language，超文本标超文本标记语言记语言）是一种用来制作超文本文档的简单标记语言。用是一种用来制作超文本文档的简单标记语言。用HTML语言编写的超文本文件称为语言编写的超文本文件称为HTML文件文件，也称为，也称为Web文件。文件。HTML文件的扩展名为文件的扩展名为.htm或或.h

2、tml。 HTML文件是一种标准的文件是一种标准的纯文本文件纯文本文件，之所以被称为，之所以被称为超文本超文本，因为，因为HTML文档中可以加入图片、声音、动画、文档中可以加入图片、声音、动画、影视等内容，并且这些内容可以被标记成超链接。影视等内容，并且这些内容可以被标记成超链接。用浏览器用浏览器打开打开HTML文件可以使用任何文本编辑器，如：文件可以使用任何文本编辑器，如：“记事本记事本”和和“写字板写字板”。但是利用文本编辑器软件编写但是利用文本编辑器软件编写HTML文件非常麻烦，效文件非常麻烦，效率很低，因此有很多专门的优秀的率很低，因此有很多专门的优秀的 HTML编辑器。编辑器。常用的

3、常用的HTML编辑软件有编辑软件有FrontPage，Dreamweaver等，等，它们都是它们都是所见即所得所见即所得的编辑器，在屏幕页面进行交互设计，的编辑器，在屏幕页面进行交互设计，将自动生成对应的将自动生成对应的 HTML文件，并且具有文件，并且具有预览预览功能，大大提功能，大大提高了设计高了设计WEB页的效率。页的效率。HTML语言概述语言概述HTML语言概述语言概述简单地说简单地说HTML文件包含文件包含文档数据文档数据和和显示格式显示格式两部分。两部分。文档数据文档数据 显示显示WWW浏览器中的数据内容。浏览器中的数据内容。显示格式显示格式 这些内容以何种格式显示。这些内容以何种

4、格式显示。HTML 语言是语言是 通过利用通过利用 各种各种标记标记(Tags)标识文档的结构标识文档的结构以及标识超链接以及标识超链接(Hyerlink)的信息的信息HTML中的标记大致可分为：文档标记、排版标记、字体中的标记大致可分为：文档标记、排版标记、字体标记、表格标记、图像与控制标记、超级链接标记等。标记、表格标记、图像与控制标记、超级链接标记等。 HtmlHtml语言使用标语言使用标记记对的方法编写文件，既简对的方法编写文件，既简单又方便，它通常使用单又方便，它通常使用 来表来表示标志的开始和结束。有的控制语句仅需一个标示标志的开始和结束。有的控制语句仅需一个标记，没有尾标记。记，

5、没有尾标记。标记可以标记可以嵌套嵌套使用。使用。 如：如：中华人民共和国中华人民共和国 粗体粗体 网络技术及应用网络技术及应用 斜体斜体 你好你好 返行返行 水平线水平线怎样生成怎样生成html文件文件新建一个空白文本文档，在上面输入新建一个空白文本文档，在上面输入HTMLHTML语言，语言，点菜单项点菜单项“文件文件另存为另存为” ，弹出对话框，弹出对话框，“保存保存类型类型”填填“所有类型所有类型”， “文件名文件名”填填“* *.htm.htm”, ,那么在那么在你保存的位置就会出现一个网页文件，修改的话在网页文你保存的位置就会出现一个网页文件，修改的话在网页文件的菜单项件的菜单项“查看

6、查看源文件源文件” 中修改，中修改，最后保存并刷新网页看新效果。最后保存并刷新网页看新效果。文章的头部，包括标文章的头部，包括标题（双标记题（双标记）提纲提纲文章的正文文章的正文能举个例子能举个例子吗？吗？网页制作网页制作大家好！这是偶第一次做网页！大家好！这是偶第一次做网页！ 加油奥加油奥! 文档头文档头标题标题文文档档体体单标记单标记标记嵌套标记嵌套简单网页制作示例简单网页制作示例 许多单标记和双标记的首标记内可以包含一些许多单标记和双标记的首标记内可以包含一些属性。属性。语法：语法：例：例： Hr：在文档的当前位置划一条水平线的标记在文档的当前位置划一条水平线的标记 Size 属性定义线

7、的粗细属性定义线的粗细 Align 属性定义对齐方式属性定义对齐方式 Width 属性定义线的长度属性定义线的长度 color属性定义线的颜色属性定义线的颜色 (1) 标志用于标志用于Html文档的最前边，用来标识文档的最前边，用来标识Html文档的开始。而文档的开始。而标志恰恰相反，它放在标志恰恰相反，它放在Html文档文档的最后边，用来标识的最后边，用来标识Html文档的结束。文档的结束。 (2) 和和构成构成Html文档的头部信息文档的头部信息，在此标在此标志对之间可以使用志对之间可以使用 、 等等等等标志对，标志对， 标志对之间的内容不会在浏览器标志对之间的内容不会在浏览器的框内显示出

8、来的框内显示出来。文档标记文档标记(3) 要将您的网页的主题显示到浏览器的顶部其实很简单，要将您的网页的主题显示到浏览器的顶部其实很简单，只要在只要在 标志对之间加入您要显示的文本即可。标志对之间加入您要显示的文本即可。注意：注意： 标志对只能放在标志对只能放在 标标志对之间。志对之间。(4) 是是Html文档的主体部分，此标志对之间文档的主体部分，此标志对之间可包含可包含 、 、 等众多的标志，它等众多的标志，它们所定义的文本、图像等将会在浏览器框内显示出来。们所定义的文本、图像等将会在浏览器框内显示出来。|bgcolor 设置背景颜色设置背景颜色|text 设置文本颜色设置文本颜色例：例：

9、|background 设置背景图片设置背景图片例：例：|link 设置链接颜色设置链接颜色|vlink 设置已使用的链接的颜色设置已使用的链接的颜色|alink 设置正在被击中的链接的颜色设置正在被击中的链接的颜色标志中常用属性：标志中常用属性：颜色设定颜色设定的三种常用方法：的三种常用方法： 用颜色常量名表示，如：用颜色常量名表示，如：Black、White、Green、Maroon、Olive、Navy、Purple、Gray、Yellow、Fuchsia、Silver、Red、Blue等。等。例：例： 红色背景红色背景 用六位十六进制用六位十六进制(rrggbb)表示：前两位表示红，中

10、间表示：前两位表示红，中间两位表示绿色、后两位为蓝色。数字以两位表示绿色、后两位为蓝色。数字以#开头。开头。例：例： 蓝色文本蓝色文本 用用RGB函数表示：函数表示：格式为格式为RGB(红色值红色值,绿色值绿色值,蓝色值蓝色值)例：例： 蓝色文本蓝色文本（5） 设置背景音乐，设置背景音乐，单标记单标记属性：属性：src：指明背景音乐所有路径及文件完整名称：指明背景音乐所有路径及文件完整名称loop：指定音乐播放的次数：指定音乐播放的次数使用方法：使用方法：(1) 标记：标记：书写说明文字，内容不书写说明文字，内容不在浏览器中显示。在浏览器中显示。(2) 标记：标记：双标记。用来创建一个段落的标

11、记，双标记。用来创建一个段落的标记，标记间的文本按照段落的格式在浏览器中显示。标记间的文本按照段落的格式在浏览器中显示。 属性：属性：Align（对齐方式对齐方式）：）：Left（左对齐左对齐）、Center（居中居中）和和Right（右对齐右对齐）(3) 标记：标记：单标记。用来创建一个回车单标记。用来创建一个回车换行换行排版标记排版标记二者区别示例二者区别示例(4) 标记：标记：单标记。在该位置加入一条水平线。单标记。在该位置加入一条水平线。 属性：属性：Size，Color，Width，Align，Noshade。 粗细粗细 颜色颜色 长度长度 对齐方式对齐方式 无阴影无阴影演示(1)

12、、. 双标记。双标记。他们是六他们是六种不同等级的种不同等级的标题标记标题标记，从大到小，可以增加属性，从大到小，可以增加属性Align，定义对齐方式。定义对齐方式。文本控制标记文本控制标记标题示例标题示例这是一行普通文字这是一行普通文字一级标一级标题题二级标题二级标题三级标题三级标题四级标题四级标题五级标题五级标题六级标题六级标题每一个标题的每一个标题的字体为黑体字字体为黑体字(2) 标记：标记：双标记。用来设置输出文本双标记。用来设置输出文本的字体、字号、颜色等的字体、字号、颜色等。常用属性：常用属性：Face、Size、Color加油加油加油加油(3) 、标记：标记：双标记。双标记。 指

13、定文指定文本为粗体。本为粗体。指定文本为斜体。指定文本为斜体。 指定文本为下指定文本为下划线。划线。 济南大学济南大学(4) 和和标记：标记：双标记。双标记。 指定指定下标文本，下标文本， 指定上标文本。指定上标文本。X2+y3SIZE属性的有效值范围为属性的有效值范围为1-7，其中缺省值为，其中缺省值为3。 图像是在网页制作中是非常重要的一个方图像是在网页制作中是非常重要的一个方面。面。在在HTML中可以支持多种格式的图片：中可以支持多种格式的图片：bmp、gif、jpg。图像标记图像标记图像嵌入标记为图像嵌入标记为单标记。单标记。 标记标记并不是真正地把图像加入到并不是真正地把图像加入到H

14、TML中，而是将标中，而是将标记的记的src属性赋值为图形文件所在的路径属性赋值为图形文件所在的路径。路径可。路径可以是相对路径、绝对路径，也可以是网址。以是相对路径、绝对路径，也可以是网址。 标记中必须含有标记中必须含有Src属性。属性。路径路径v相对路径：所要链接或嵌入的文件与当前文件（网页文件）的相对相对路径：所要链接或嵌入的文件与当前文件（网页文件）的相对位置所形成的路径。以当前文件所在路径为起点。位置所形成的路径。以当前文件所在路径为起点。链接同一目录下的文件，则只需输入要链接文件的名称。链接同一目录下的文件，则只需输入要链接文件的名称。链接下级目录中的文件，只需先输入目录名，然后加

15、链接下级目录中的文件，只需先输入目录名，然后加“/”，再输，再输入文件名。入文件名。 链接上一级目录中文件，则先输入链接上一级目录中文件，则先输入“./”，再输入文件名。，再输入文件名。相对路径相对路径: v绝对路径：指包含服务器通信协议在内的完全路径，即一个正确的绝对路径：指包含服务器通信协议在内的完全路径，即一个正确的URL地址。地址。通讯协议通讯协议 ：/服务器地址：通讯端口服务器地址：通讯端口/文件位置文件位置./文件名文件名 其他的属性还有：其他的属性还有：(1) Alt ：图像不能下载时用以替代的文字。图像不能下载时用以替代的文字。(2) Align：对齐方式。对齐方式。文本对齐文

16、本对齐：top、bottom、middle；图形对齐图形对齐：left、right。(3) Border：图像的边框。图像的边框。可取可取0的整数。的整数。(4) Width和和Height：图像的高和宽。图像的高和宽。(5) Hspace和和Vspace：图片的水平位置和垂直位置。图片的水平位置和垂直位置。 例例5.3 例例5.3属性属性 图像标记的属性图像标记的属性当需要定义图像、音乐、应用程序或超媒体链接的链当需要定义图像、音乐、应用程序或超媒体链接的链接地址时，需要使用链接标记。接地址时，需要使用链接标记。为双标记，标记对之为双标记，标记对之间加入需要在浏览器中显示的链接名称。间加入需

17、要在浏览器中显示的链接名称。6.2.5 超级链接标记超级链接标记 (1) 标记的格式标记的格式 1） Href属性：属性：指明要链接对象的地址，指明要链接对象的地址， Href的值可以的值可以是是URL形式，网址或相对路径，也可以是形式，网址或相对路径，也可以是mailto。即发送即发送E-mail形式。形式。 语法：语法：相关文字相关文字 例例6-42） Target属性：属性：定义被链接的目标在指定的窗口中打定义被链接的目标在指定的窗口中打开。开。 相关文字相关文字 例例5-4加加Target属性属性（2）超链接的常用属性超链接的常用属性3）Name属性：用来在属性：用来在HTML文档中创

18、建一个书签（或称文档中创建一个书签（或称锚点）。锚点）。语法：语法： 在当前位置建立一个名字叫在当前位置建立一个名字叫label的书签的书签（也叫锚点也叫锚点）。例：例：当日车市报价表当日车市报价表创建书签就是为了在创建书签就是为了在HTML文档中创建一些链接，以方便文档中创建一些链接，以方便地找到文档中有书签的地方。要找到同一页面书签所在地，必地找到文档中有书签的地方。要找到同一页面书签所在地，必须使用书签链接：须使用书签链接：链接到当前文档中名字叫链接到当前文档中名字叫label的书签位置；的书签位置；例如：例如：要找到要找到“车市报价车市报价”这个书签，代码如下：这个书签，代码如下： 点

19、击此处将使浏览器跳到车市报价处点击此处将使浏览器跳到车市报价处 书签书签.html用图像作为超级链接源用图像作为超级链接源可以用一个页面上的图片建立超级链接，只要将图片的可以用一个页面上的图片建立超级链接，只要将图片的标记包含在标记包含在标记之中即可。标记之中即可。图像作为超级链接源示例图像作为超级链接源示例.html 6.2.7 声音标记声音标记将音乐做成一个链接，只需用鼠标在上面单击，就将音乐做成一个链接，只需用鼠标在上面单击，就可以听到动人的音乐了，这样做的方法很简单：可以听到动人的音乐了，这样做的方法很简单：乐曲名乐曲名 点播音乐点播音乐例如：例如：菊花台菊花台宁夏宁夏原来你也在这里原

20、来你也在这里 把我们喜欢的音乐收集起来，作成一个音乐库，随时都可把我们喜欢的音乐收集起来，作成一个音乐库，随时都可以让自己和别人徜徉在音乐的海洋中，已经有人这样做了，你以让自己和别人徜徉在音乐的海洋中，已经有人这样做了，你一定已经遇到很多，而且自己也可以试着去做了！一定已经遇到很多，而且自己也可以试着去做了！点播音乐点播音乐.html前面，我们是借助链接来实现网上播放音乐前面，我们是借助链接来实现网上播放音乐这一功能的，我们还可以让音乐自动载入，你可这一功能的，我们还可以让音乐自动载入，你可以让它出现控制面板或当背景音乐来使用。基本以让它出现控制面板或当背景音乐来使用。基本语法：语法：该功能也

21、适用于视频文件的载入。该功能也适用于视频文件的载入。自动载入音乐的标记还有一些常用的属性自动载入音乐的标记还有一些常用的属性: 自动载入音乐自动载入音乐自动载入音乐自动载入音乐自动载入音乐标记的属性自动载入音乐标记的属性SRC=FILENAME设定音乐文件的路径设定音乐文件的路径AUTOSTART=TRUE/FALSE是否要音乐文件传送完就自动播放，是否要音乐文件传送完就自动播放，TRUE是要，是要，FALSE是不要是不要LOOP=n/TRUE/FALSE设定播放重复次数，设定播放重复次数，LOOP=6表示重复表示重复6次，次，TRUE表示无限次播放，表示无限次播放，FALSE播放一次即停播放

22、一次即停止。止。STARTIME=分分:秒秒设定乐曲的开始播放时间，如设定乐曲的开始播放时间，如20秒后播放秒后播放写为写为STARTIME=00:20VOLUME=0-100设定音量的大小。如果没设定的话，就用设定音量的大小。如果没设定的话，就用系统的音量。系统的音量。WIDTH HEIGHT设定控制面板的大小设定控制面板的大小HIDDEN=TRUE隐藏控制面板隐藏控制面板CONTROLS=CONSOLE/SMALLCONSOLE设定控制面板的样子设定控制面板的样子例：例：背景音乐背景音乐 播放音乐播放音乐 作为背景音乐来播放。作为背景音乐来播放。 自动播放隐藏例：例：控制音乐控制音乐 播放

23、音乐播放音乐 出现控制面板了，你可以控制它的开与关，还可出现控制面板了，你可以控制它的开与关，还可以调节音量的大小。以调节音量的大小。 用浏览器可以播放的格式有：用浏览器可以播放的格式有：mov、avi、wmv、mpg、dat等格式。等格式。 |链接一个视频文件链接一个视频文件视频名称视频名称|嵌入一个视频文件嵌入一个视频文件Embed Src=文件地址及名称文件地址及名称 autostart=true|false |自动载入视频：自动载入视频： 播放视频播放视频例：例：视频播放视频播放播放视频播放视频 视频点播视频点播 shania1.asf 全球耗资最高的全球耗资最高的MTV 嵌入视频自动

24、载入视频链接视频表格表格(Table)是网页制作中安排布局最好的工是网页制作中安排布局最好的工具，因为表格不但可以很好的安排文本或图像的具，因为表格不但可以很好的安排文本或图像的显示位置，而且还可以任意的进行背景和前景颜显示位置，而且还可以任意的进行背景和前景颜色的设置。色的设置。6.2.8 表表 格格 标记标记 双标记，用来创建一个表格。双标记，用来创建一个表格。 标记标记有许多属性，用来定义表格的外观特征。详细的表有许多属性，用来定义表格的外观特征。详细的表格属性有：格属性有：属属 性性 用用 途途Bgcolor设置表格的背景色设置表格的背景色Background表格的背景图片表格的背景图

25、片Border设置边框的宽度，边框宽度默认是设置边框的宽度，边框宽度默认是0无边框，无格线无边框，无格线Bordercolor设置边框的颜色设置边框的颜色bordercolorlight设置边框明亮部分的颜色设置边框明亮部分的颜色bordercolordark设置边框昏暗部分的颜色设置边框昏暗部分的颜色Cellspacing设置单元格之间空间的大小设置单元格之间空间的大小Cellpadding设置表格单元格边框与其内部内容之间的距离设置表格单元格边框与其内部内容之间的距离Width设置表格的宽度设置表格的宽度Height设置表格的高度设置表格的高度双标记。表示表格的标题，一般出现在双标记。表示

26、表格的标题，一般出现在首标记与第一个首标记与第一个之间。之间。 标记标记属性：属性：Align 对齐方式对齐方式 left, right, top, bottom 例：例：表格标记示例表格标记示例 一个表格由若干行一个表格由若干行（Row）构成，每一行又由若干个构成，每一行又由若干个单元格单元格（Cell）组成。组成。 标记标记 表行标记表行标记属性：属性： Align , Valign, width,height,bgcolor Align水平对齐方式：水平对齐方式：left（左对齐左对齐），center（居中居中），right （右对齐右对齐） Valign垂直对齐方式：垂直对齐方式：to

27、p（顶端对齐顶端对齐），），middle（居中对齐居中对齐），bottom（底端对齐底端对齐） 、标记标记 表头单元格标记表头单元格标记，表头数据自动加，表头数据自动加粗并且居中显示，其他与粗并且居中显示，其他与一样。一样。 数据单元格标记数据单元格标记属性：属性： Align, Valign , bgcolor,width,height,Colspan,RowspanColspan：设置一个表格单元格跨占的列数设置一个表格单元格跨占的列数(缺省值为缺省值为1)；Rowspan：设置一个表格单元格跨占的行数设置一个表格单元格跨占的行数(缺省值为缺省值为1)；例：例：colspan属性示例属性示

28、例 表示表格开始表示表格开始创建表格第一行创建表格第一行创建表格内的单元格，创建表格内的单元格，此标记内的文字就是单元格内此标记内的文字就是单元格内的文字的文字格式如下格式如下:创建表格第二行创建表格第二行 列列1 列列2 列列3 表表 数据数据21 格格 数据数据22 数据数据23 数据数据31 数据数据32 数据数据33 第一行第一行 第二行第二行第三行第三行、或或之间有着之间有着 严格的层次关系。严格的层次关系。表单表单（Form）在在Web网页中用来给访问者填写信息，网页中用来给访问者填写信息，从而能获得用户信息，使网页具有交互能力。从而能获得用户信息，使网页具有交互能力。表单和表单和

29、Windows的对话框类似，由若干控件组成的，的对话框类似，由若干控件组成的，用于实现和用户的交互。用于实现和用户的交互。当用户填写完信息后进行提交当用户填写完信息后进行提交（Submit）操作，于是表单的内容就从客户端的浏览器传操作，于是表单的内容就从客户端的浏览器传送到服务器上。经过送到服务器上。经过Web服务器上的服务器上的 ASP 或或 CGI 等处理等处理程序处理后，再将用户所需信息传送回客户端的浏览器上，程序处理后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性这样网页就具有了交互性 。6.2.10、 表表 单单双标记。用来创建一个表单，即定义表单的开始和结束位置，

30、双标记。用来创建一个表单，即定义表单的开始和结束位置，标记对之间的内容都属于表单的内容。标记对之间的内容都属于表单的内容。属性：属性：Action 处理程序的网络路径和程序名。处理程序的网络路径和程序名。例：例：Method：用来定义处理程序从表单中获得信息的方式。可取值用来定义处理程序从表单中获得信息的方式。可取值为为get或或post，默认为，默认为post 。get方式方式是处理程序从当前是处理程序从当前HTML文档中获取数据，数据量有限，文档中获取数据，数据量有限，一般限制在一般限制在1KB以下。以下。Post方式方式方式与方式与get相反，当前的相反，当前的HTML把数据传送给处理程

31、序，把数据传送给处理程序，传送的数据量大。传送的数据量大。Target：属性用来指定目标窗口或目标帧。属性用来指定目标窗口或目标帧。 （1）表单标记）表单标记例例6.8 表单应用示例表单应用示例单标记。用来定义表单内的控件类型，此标记必须放在单标记。用来定义表单内的控件类型，此标记必须放在标志对之间。通过该标记的标志对之间。通过该标记的type来指定控件的类型。来指定控件的类型。该标记内都有该标记内都有Name和和Value属性，另外还可有属性，另外还可有size属性。属性。（2）标记标记属性值属性值控件类型控件类型属性值属性值控件类型控件类型Text单行文本框单行文本框Reset重填按钮重填

32、按钮Checkbox复复 选选 框框 Button普通按钮普通按钮Radio单单 选选 按按 钮钮Image提交图片提交图片Password密码输入框密码输入框Hidden隐藏控件隐藏控件Submit提提 交交 按按 钮钮File文件上传文件上传双标记。用来创建一个多行文本框，此标记用于双标记。用来创建一个多行文本框，此标记用于标记对之间。标记对之间。其形式如下：其形式如下：初初始文本始文本属性：属性： Name，Cols和和RowsCols 和和 Rows 属性分别用来设置文本框的列数和行数，属性分别用来设置文本框的列数和行数，列数以字符数为单位。在首尾标记之间的所有文本都是列数以字符数为单

33、位。在首尾标记之间的所有文本都是该控件的初值。该控件的初值。（3） 标记标记例例 6.8 表单应用示例表单应用示例：双标记。双标记。用来创建一个下拉列表框或可以复用来创建一个下拉列表框或可以复选的列表框。此标记用于选的列表框。此标记用于标记对之间。标记对之间。其其形式为：形式为： 属性：属性： Multiple ：不用赋值，直接加入到标记中，列表框不用赋值，直接加入到标记中，列表框可以多项选择。可以多项选择。 Name:列表框的输入域名。列表框的输入域名。Size:用来设置列表的高度，缺省值是用来设置列表的高度，缺省值是1。若没有加入若没有加入Multiple属性，显示的将是一个单选列表框，属

34、性，显示的将是一个单选列表框，（4） 、标记标记例例 6.8 表单应用示例表单应用示例：双标记。用来指定列表框中的一个选项双标记。用来指定列表框中的一个选项。此标记用于此标记用于 标记对之间。标记对之间。其形式如下：其形式如下： 属性：属性： Selected ：用来指定默认的选项。用来指定默认的选项。 Value:用来指定该选项的取值用来指定该选项的取值当用户进行选择操作并且选中该项时，当用户进行选择操作并且选中该项时，名将名将得到这个值。发送时这个值是要传送到服务器上的，服务器得到这个值。发送时这个值是要传送到服务器上的，服务器通过调用通过调用名字的名字的Value属性来获得该区域选中的数

35、属性来获得该区域选中的数据项。据项。当当标记不含有标记不含有VALUE属性时，则以选项文本属性时，则以选项文本作为最后的取值。作为最后的取值。例例 6.8 表单应用示例表单应用示例http:/编写组5.3 网页制作网页制作 例例5.2一个简单的表单示例一个简单的表单示例一个简单的表单示例一个简单的表单示例用户名：用户名：密码：密码： 要制作一个漂亮、直观的要制作一个漂亮、直观的Web网页，除了要了解网页，除了要了解HTML语言知识外，一般来说，还需要掌握一种语言知识外，一般来说，还需要掌握一种Web网网页可视化制作软件，如页可视化制作软件，如DreamWeawer、FrontPage等，等，这

36、样可以提高程序设计的效率，缩短软件研发周期。这样可以提高程序设计的效率，缩短软件研发周期。DreamWeawer和和FrontPage在功能上各有千秋。在功能上各有千秋。DreamWeaver功能更强大一些，冗余代码少，站点管功能更强大一些，冗余代码少，站点管理、特效实现等轻而易举。理、特效实现等轻而易举。DreamWeaver有多个不同有多个不同的版本，本节我们将详细介绍的版本，本节我们将详细介绍的使用方法。的使用方法。6.3 Dreamweaver网页设计网页设计 了解了解之后进入该界面之后进入该界面插入栏插入栏文档窗口文档窗口标签检查器标签检查器属性检查器属性检查器面板组面板组文件面板文

37、件面板 Dreamweaver菜单包括文件，编辑，查看，插入，修菜单包括文件，编辑，查看，插入，修改，文本，命令，站点，窗口，帮助。改，文本，命令，站点，窗口，帮助。文件：文件：包括对文件的各种操作。包括对文件的各种操作。编辑：编辑：包含了对文件的复制，粘贴，查找与替换等命令。包含了对文件的复制，粘贴，查找与替换等命令。查看：查看：使用查看菜单可以查看文档的相关内容。使用查看菜单可以查看文档的相关内容。插入：插入：用于将对象插入文档中。用于将对象插入文档中。修改：修改：可以使用修改菜单更改选定页面元素的属性。可以使用修改菜单更改选定页面元素的属性。文本：文本：可以设置文本的格式，如段落格式，字

38、体等。可以设置文本的格式，如段落格式，字体等。命令：命令：提供各种命令的访问。提供各种命令的访问。站点：站点：提供用于管理站点以及上传和下载文件的菜单项。提供用于管理站点以及上传和下载文件的菜单项。窗口：窗口：提供提供对对Dreamweaver中的所有面板，检查器和窗口的中的所有面板，检查器和窗口的访问。访问。帮助：帮助：提供了对提供了对Dreamweaver文档文档的访问。的访问。建立基本站点建立基本站点 1、新建并保存网页、新建并保存网页页面制作页面制作在编辑网页之前，可以对网页的一些参数进行设置，在编辑网页之前，可以对网页的一些参数进行设置，这些参数将会影响到整个网页。这些参数将会影响到

39、整个网页。按按“Ctrl+J”键或单击属性检查器上的键或单击属性检查器上的“页面属性页面属性”按钮，将弹出页面属性对话框。按钮，将弹出页面属性对话框。外观：外观：页面字体、文本颜色、背景色、背景图片页面字体、文本颜色、背景色、背景图片链接：链接：链接字体、颜色、已访问的链接颜色等。链接字体、颜色、已访问的链接颜色等。标题标题/编码：编码：标题浏览时显示在标题栏中；编码为文标题浏览时显示在标题栏中；编码为文档所使用的编码，一般为档所使用的编码，一般为“简体中文简体中文”。2、页面设置、页面设置插入的图片插入的图片导航条导航条Flash链接链接嵌入音乐嵌入音乐Flash页面属性页面属性3、插入文本

40、、插入文本文本包括文本包括普通文字普通文字，特殊符号特殊符号，时间日期时间日期，注释注释语句语句等内容。等内容。可以直接在可以直接在 DreamWeaver 文档窗口中键入文本；文档窗口中键入文本；也可以使用也可以使用“剪贴板剪贴板”工具复制文本。工具复制文本。注意：注意：DreamWeaver 一般不保留在其他应用程一般不保留在其他应用程序中应用的文本格式，但它保留换行符。序中应用的文本格式，但它保留换行符。4、 设置文本格式设置文本格式（2）插入日期）插入日期 （3）插入特殊字符）插入特殊字符 （4）在字符之间添加空格）在字符之间添加空格 5、设置段落格式和文档结构设置段落格式和文档结构 （4）使用水平线）使用水平线 （5）创建项目列表）创建项目列表 5.2.5 图像和多媒体图像和多媒体 图片的环绕图片的环绕 图像映射图像映射/ /图像地图图像地图2、为页面添加声音、为页面添加声音| 链接到音频文件链接到音频文件 2、为页面添加声音、为页面添加声音| 嵌入声音文件嵌入声音文件 3、添加视频、添加视频 其操作方法与添加声音文件类其操作方法与添加声音文件类似。似。4、插入、插入Flash对象对象 （3）插入）插入 Flash 内容内容 5.2.6 链接