《Dreamweaver8和Flash8案例教程》第7章站点与链接.ppt

《《Dreamweaver8和Flash8案例教程》第7章站点与链接.ppt》由会员分享，可在线阅读，更多相关《《Dreamweaver8和Flash8案例教程》第7章站点与链接.ppt（90页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第第7 7章章 站点与链接站点与链接 【案例案例2121】修改修改“跟我学电脑跟我学电脑”站点站点7.1 【案例案例2222】建立建立“跟我学电脑跟我学电脑”网页与网页与各子页面间的链接各子页面间的链接7.2【案例案例2323】检查检查“跟我学电脑跟我学电脑”网站中的链网站中的链接接7.3【案例案例2424】上传上传“跟我学电脑跟我学电脑”网站网站7.47.1 7.1 【案例案例2121】修改修改“跟我学电脑跟我学电脑”站点站点7.1.1学习目标学习目标修改修改“跟我学电脑跟我学电脑”站点的属性后，站点的属性后，“站点站点”窗口的显示效果如图窗口的显示效果如图7-1-1所示。所示。在该站点中定

2、义了主页后，可以在在该站点中定义了主页后，可以在“站点站点”窗口的左栏中显示出窗口的左栏中显示出“跟我学电脑跟我学电脑”网网站的结构图，右栏中显示网页中的文件。站的结构图，右栏中显示网页中的文件。7.1.2操作过程操作过程图图7-1-1 修改属性后修改属性后“站点站点”窗口的显示效果窗口的显示效果7.1.3相关知识相关知识1建立新站点建立新站点（1）在）在Dreamweaver的主窗口中单的主窗口中单击击“站点站点”“管理站点管理站点”菜单命令，菜单命令，弹出弹出“管理站点管理站点”对话框，如图对话框，如图7-1-3所示。所示。（2）单击）单击“管理站点管理站点”对话框中的对话框中的“新建新建

3、”按钮，弹出按钮，弹出“新建新建”快捷菜快捷菜单。在快捷菜单中，单击单。在快捷菜单中，单击“FTP”菜菜单命令，弹出单命令，弹出“站点定义为站点定义为”（高级）（高级）对话框（打开对话框（打开“高级高级”选项卡），如选项卡），如图图7-1-4所示。所示。（3）在）在“站点名称站点名称”文本框内输入文本框内输入站点的名称。在站点的名称。在“本地根文件夹本地根文件夹”文文本框内输入站点在本主机硬盘上的存本框内输入站点在本主机硬盘上的存储位置，即路径和文件夹名称。储位置，即路径和文件夹名称。（4）在）在“HTTP地址地址”文本框内输入文本框内输入上传站点地址的上传站点地址的URL，也可不输入内，也可

4、不输入内容。容。（5）选中）选中“启用缓存启用缓存”复选框后，复选框后，可加速链接的更新速度。可加速链接的更新速度。（6）单击）单击“确定确定”按钮后，返回按钮后，返回“管理站点管理站点”对话框。在对话框的左边对话框。在对话框的左边的列表框中，将列出刚创建的站点名的列表框中，将列出刚创建的站点名称。单击称。单击“完成完成”按钮，即可返回按钮，即可返回Dreamweaver主窗口。主窗口。（7）单击）单击“文件文件”面板内第一个下面板内第一个下拉列表框中的其他站点名称，可以显拉列表框中的其他站点名称，可以显示其他站点的结构和文件。示其他站点的结构和文件。单击单击“窗口窗口”“文件文件”菜单命令，

5、菜单命令，即可弹出即可弹出“文件文件”面板，如图面板，如图7-1-2所示。所示。单击单击“文件文件”面板的标准工具栏内的面板的标准工具栏内的“扩扩展展/折叠折叠”按钮按钮，即可弹出，即可弹出“站点站点”窗窗口，如图口，如图7-1-1所示。这时该窗口中会出现所示。这时该窗口中会出现新建站点的结构与文档、文件夹的名字。新建站点的结构与文档、文件夹的名字。再单击再单击“站点站点”窗口标准工具栏内的窗口标准工具栏内的“展展开开/折叠折叠”按钮按钮，又可回到，又可回到“文件文件”面面板。板。“文件文件”面板和面板和“站点站点”窗口的特点窗口的特点如下。如下。2“文件文件”面板和面板和“站点站点”窗口窗口

6、（1）在）在“文件文件”面板和面板和“站点站点”窗窗口内可以执行标准的文件操作。将鼠口内可以执行标准的文件操作。将鼠标指针移到标指针移到“文件文件”面板内或面板内或“站点站点”窗口的本地文件显示栏内，单击鼠窗口的本地文件显示栏内，单击鼠标右键，可以弹出它的快捷菜单，利标右键，可以弹出它的快捷菜单，利用该菜单可以创建文件夹、创建文件、用该菜单可以创建文件夹、创建文件、移动文件、删除文件、打开文件和文移动文件、删除文件、打开文件和文件重命名等。件重命名等。（2）“站点站点”窗口内有两栏，左边窗口内有两栏，左边是是“地图地图”视图栏，右边是视图栏，右边是“本地文本地文件件”栏。用鼠标拖曳两栏之间的分

7、割栏。用鼠标拖曳两栏之间的分割条，可以调整两栏的大小比例，甚至条，可以调整两栏的大小比例，甚至取消其中一个栏。取消其中一个栏。（3）单击）单击“站点站点”窗口内的窗口内的“站点站点地图地图”按钮按钮右下角的黑色箭头，右下角的黑色箭头，可弹出一个菜单。单击该菜单中的可弹出一个菜单。单击该菜单中的“仅地图仅地图”菜单命令，可使右边的菜单命令，可使右边的“本本地文件地文件”栏消失。单击该菜单中的栏消失。单击该菜单中的“地图和文件地图和文件”菜单命令，可使右边的菜单命令，可使右边的“本地文件本地文件”栏显示，即切换到栏显示，即切换到“地地图和文件图和文件”状态。状态。（4）单击）单击“站点站点”窗口内

8、的窗口内的“站点站点文件文件”按钮按钮，可使，可使“站点站点”窗口窗口只显示只显示“本地文件本地文件”栏，但左边的栏栏，但左边的栏不消失，只是没有不消失，只是没有“地图地图”视图。视图。7.2.1学习目标学习目标本实例的目的是将本实例的目的是将“跟我学电脑跟我学电脑”网网站中的站中的index.htm网页作为主页，然后将各网页作为主页，然后将各个实例页面与该网页使用链接的形式串联个实例页面与该网页使用链接的形式串联起来，最终形成一个完整的网站。建立起来，最终形成一个完整的网站。建立“跟我学电脑跟我学电脑”网页与各个子页面间的链接网页与各个子页面间的链接后，该网页的显示效果如图后，该网页的显示效

9、果如图7-2-1所示。所示。7.2 7.2 【案例案例2222】建立建立“跟我学电跟我学电脑脑”网页与各子页面间的链接网页与各子页面间的链接图图7-2-1 建立各个子页面链接后的建立各个子页面链接后的“跟我学电脑跟我学电脑”网页网页在该页面中，列出了前面各章中制作在该页面中，列出了前面各章中制作的各个网页实例的名称，单击其中任意一的各个网页实例的名称，单击其中任意一个名称，即可链接到相应的页面。个名称，即可链接到相应的页面。链接的定义是：单击链接的定义是：单击HTML文件（叫文件（叫做源文件）中的一些文字（叫做热字）或做源文件）中的一些文字（叫做热字）或图像，即可用浏览器显示相应的图像，即可用

10、浏览器显示相应的HTML或或图像文件（叫做目标文件）等内容。也可图像文件（叫做目标文件）等内容。也可以说，在这些源文件的文字或图像与相应以说，在这些源文件的文字或图像与相应的目标文件的的目标文件的HTML和图像文件建立了链和图像文件建立了链接。接。7.2.2操作过程操作过程1文字或图像与外部文字或图像与外部HTML和图像和图像文件的链接文件的链接（1）利用）利用“属性属性”栏内栏内“链接链接”文文本框和文件夹按钮本框和文件夹按钮建立链接建立链接7.2.3相关知识相关知识用鼠标拖曳选中源文件中要链接的文字用鼠标拖曳选中源文件中要链接的文字或选中要链接的图像。或选中要链接的图像。单击单击“属性属性

11、”面板中的面板中的“链接链接”栏中的栏中的文件夹按钮文件夹按钮，弹出，弹出“选择文件选择文件”对话框，对话框，利用该对话框选择要链接的利用该对话框选择要链接的HTML文件或文件或图像文件（即目标文件）。也可以直接在图像文件（即目标文件）。也可以直接在文本框内输入要链接的文本框内输入要链接的HTML文件或图像文件或图像文件的路径与文件名。使用路径时，一定文件的路径与文件名。使用路径时，一定要注意相对路径与绝对路径的使用方法，要注意相对路径与绝对路径的使用方法，通常最好使用相对路径。通常最好使用相对路径。（2）利用）利用“属性属性”栏内栏内“链接链接”栏栏的指向图标的指向图标建立链接建立链接在网页

12、编辑窗口内，同时打开要建立链在网页编辑窗口内，同时打开要建立链接的源文件和要链接的目标文件（接的源文件和要链接的目标文件（HTML文件），如图文件），如图7-2-2所示。所示。图图7-2-2 7-2-2 利用利用“属性属性”栏栏内内“链链接接”栏栏的指向的指向图标图标建立建立链链接接选中建立链接的源文件中的文字或图像选中建立链接的源文件中的文字或图像（如选中图（如选中图7-2-2中左边网页中的文字）。中左边网页中的文字）。用鼠标拖曳文字或图像用鼠标拖曳文字或图像“属性属性”栏内栏内“链接链接”栏的指向图标栏的指向图标到图到图7-2-2中右边网中右边网页编辑窗口内，这时会产生一个从指向图页编辑窗

13、口内，这时会产生一个从指向图标标指向目标文件的箭头，如图指向目标文件的箭头，如图7-2-2所示。所示。然后松开鼠标左键，即可完成链接。然后松开鼠标左键，即可完成链接。（3）利用）利用“文件文件”面板的链接方法面板的链接方法弹出弹出“文件文件”面板，使要链接的目标文面板，使要链接的目标文件名字出现在件名字出现在“文件文件”面板内。同时在网面板内。同时在网页编辑窗口内打开建立链接的源文件。页编辑窗口内打开建立链接的源文件。选中网页编辑窗口内建立链接的源文件选中网页编辑窗口内建立链接的源文件中的文字或图像（如选中图中的文字或图像（如选中图7-2-3中左边网中左边网页编辑窗口内的图像）。页编辑窗口内的

14、图像）。图图7-2-3 利用利用“文件文件”面板的链接方法面板的链接方法用鼠标拖曳文字或图像用鼠标拖曳文字或图像“属性属性”栏内栏内“链接链接”栏的指向图标栏的指向图标移到图移到图7-2-3中中“文文件件”面板内要链接的目标文件（面板内要链接的目标文件（01.htm），），这时会产生一个从指向图标这时会产生一个从指向图标指向目标文指向目标文件的箭头。当目标文件名字周围出现矩形件的箭头。当目标文件名字周围出现矩形框时，松开鼠标左键，即可完成链接。框时，松开鼠标左键，即可完成链接。（4）利用）利用“站点站点”窗口的链接方法窗口的链接方法一一打开打开“站点站点”窗口，使要链接的目标文窗口，使要链接的

15、目标文件名字出现在件名字出现在“站点站点”窗口右边的窗口右边的“站点站点文件文件”栏内，使源文件出现在栏内，使源文件出现在“站点站点”窗窗口左边的口左边的“地图地图”视图栏内。视图栏内。选中选中“站点站点”窗口左边窗口左边“地图地图”视图栏视图栏内建立链接的源文件图标，此时源文件图内建立链接的源文件图标，此时源文件图标右上方会出现一个指向图标标右上方会出现一个指向图标，如图，如图7-2-4所示。所示。图图7-2-4 利用利用“站点站点”窗口的链接方法窗口的链接方法 如果没有出现指向图标如果没有出现指向图标，可在源文，可在源文件图标上单击鼠标右键，弹出其快捷菜单，件图标上单击鼠标右键，弹出其快捷

16、菜单，再单击菜单中的再单击菜单中的“显示显示/隐藏链接隐藏链接”菜单选菜单选项，即可使指向图标项，即可使指向图标显示出来。显示出来。用鼠标拖曳用鼠标拖曳“站点站点”窗口左边窗口左边“地图地图”视图栏内的指向图标视图栏内的指向图标到图到图7-2-4中中“站站点点”窗口右边框架内要链接的目标文件。窗口右边框架内要链接的目标文件。这时，会产生一个从指向图标这时，会产生一个从指向图标指向目标指向目标文件的箭头。当目标文件名字周围出现矩文件的箭头。当目标文件名字周围出现矩形框时，松开鼠标左键，即可完成链接。形框时，松开鼠标左键，即可完成链接。（5）利用）利用“站点站点”窗口的链接方法窗口的链接方法二二用

17、鼠标右键单击源文件图标，弹出它的用鼠标右键单击源文件图标，弹出它的快捷菜单，单击该菜单中的快捷菜单，单击该菜单中的“链接到已有链接到已有文件文件”菜单命令，弹出菜单命令，弹出“选择选择HTML文件文件”对话框，利用它可以选择要链接的目标对话框，利用它可以选择要链接的目标文件。文件。如果单击源文件图标快捷菜单中的如果单击源文件图标快捷菜单中的“链链接到新文件接到新文件”菜单命令，会弹出菜单命令，会弹出“链接到链接到新文件新文件”对话框，如图对话框，如图7-2-5所示。利用它所示。利用它输入要链接的输入要链接的HTML文件名字、标题和链文件名字、标题和链接文本，单击接文本，单击“确定确定”按钮，即

18、可建立一按钮，即可建立一个新的已链接的个新的已链接的HTML文件。文件。图图7-2-5 “链接到新文件链接到新文件”对话框对话框上述方法产生的链接会在源文件内自上述方法产生的链接会在源文件内自动产生一个热字和标题字，热字的内容就动产生一个热字和标题字，热字的内容就是目标文件的名字或是目标文件的名字或“链接到新文件链接到新文件”对对话框中输入的文字。可以编辑、修改热字话框中输入的文字。可以编辑、修改热字的内容，但要先输入新的内容，然后再删的内容，但要先输入新的内容，然后再删除原内容。除原内容。当页面的内容很长时，在浏览器中查当页面的内容很长时，在浏览器中查看某一部分的内容会很麻烦，这时可以在看某

19、一部分的内容会很麻烦，这时可以在要查看内容的地方加一个定位标记，即锚要查看内容的地方加一个定位标记，即锚点（也做叫锚记）。这样，可以建立页面点（也做叫锚记）。这样，可以建立页面内文字或图像与锚点的链接，单击页面内内文字或图像与锚点的链接，单击页面内文字或图像后，浏览器中会迅速显示锚点文字或图像后，浏览器中会迅速显示锚点处的内容。也可以建立页面内文字或图像处的内容。也可以建立页面内文字或图像与其他与其他HTML文件中的锚点的链接。在页文件中的锚点的链接。在页面内设置锚点的方法如下。面内设置锚点的方法如下。2文字或图像与文字或图像与HTML文件锚点的链文件锚点的链接接（1）单击页面内要设置锚点的地

20、方，）单击页面内要设置锚点的地方，将光标移至此处。再单击将光标移至此处。再单击“插入插入”（常用）面板内的（常用）面板内的“命名锚记命名锚记”按钮按钮，弹出，弹出“命名锚记命名锚记”对话框，如图对话框，如图7-2-6所示。所示。图图7-2-6 “命名锚记命名锚记”对话框对话框（2）在）在“锚记名称锚记名称”文本框内输入文本框内输入锚点的标记名称（例如锚点的标记名称（例如MD1）。再单）。再单击击“确定确定”按钮，退出该对话框。同按钮，退出该对话框。同时，在页面光标处会产生一个锚点标时，在页面光标处会产生一个锚点标记记。如果看不到该标记，可以单。如果看不到该标记，可以单击击“查看查看”“可视化助

21、理可视化助理”“不不可见元素可见元素”菜单选项。菜单选项。在浏览器内不会显示锚点标记。在浏览器内不会显示锚点标记。（3）选中页面内的文字或图像，再）选中页面内的文字或图像，再按照下述的方法之一建立它们与锚点按照下述的方法之一建立它们与锚点的链接。的链接。在在“属性属性”栏内的栏内的“链接链接”文本框内输文本框内输入入“#”和锚点的名字。例如，输入和锚点的名字。例如，输入“#MD1”，即可完成选中的文字或图像与，即可完成选中的文字或图像与锚点的链接。锚点的链接。用鼠标拖曳用鼠标拖曳“链接链接”栏的指向图标栏的指向图标到到目标锚点上，再松开鼠标左键，即可完成目标锚点上，再松开鼠标左键，即可完成选中

22、的文字或图像与锚点的链接，如图选中的文字或图像与锚点的链接，如图7-2-7所示。所示。图图7-2-7 7-2-7 拖曳指向拖曳指向图标图标建立与建立与锚锚点的点的链链接接如果选中的是文字，则按住如果选中的是文字，则按住Shift键，同键，同时将鼠标指针移到选中的文字上，按下鼠时将鼠标指针移到选中的文字上，按下鼠标左键再拖曳，此时鼠标指针会变为类似标左键再拖曳，此时鼠标指针会变为类似于指向图标于指向图标。接着拖曳指向图标。接着拖曳指向图标与锚与锚点图标重合，如图点图标重合，如图7-2-8所示，再松开鼠标所示，再松开鼠标左键，即可完成选中的文字与锚点的链接。左键，即可完成选中的文字与锚点的链接。图

23、图7-2-8 拖曳鼠标建立与锚点的链接拖曳鼠标建立与锚点的链接 7.3.1学习目标学习目标将将“跟我学电脑跟我学电脑”站点下所有网页中站点下所有网页中的的mailto:邮件链接全部邮件链接全部替换成替换成后，后，“跟我学电跟我学电脑脑”网页（部分）的显示效果如图网页（部分）的显示效果如图7-3-1所所示。示。7.3 7.3 【案例案例2323】检查检查“跟我学电跟我学电脑脑”网站中的链接网站中的链接图图7-3-1 “跟我学电脑跟我学电脑”网页（部分）的显示效果网页（部分）的显示效果当站点的许多文件与一个文件（如一当站点的许多文件与一个文件（如一个外部文件）的链接失效时，不必一个一个外部文件）的

24、链接失效时，不必一个一个地进行修改，可以成批地进行链接的替个地进行修改，可以成批地进行链接的替换。这种链接替换不但对站点内目标文件换。这种链接替换不但对站点内目标文件有效，而且对站点外部目标文件也有效。有效，而且对站点外部目标文件也有效。7.3.2操作过程操作过程1链接的检查与修复链接的检查与修复（1）自动检查链接）自动检查链接当用户在当用户在“站点站点”窗口的窗口的“站点文件站点文件”栏内将一个文件移到其他文件夹内时，栏内将一个文件移到其他文件夹内时，会自动弹出一个会自动弹出一个“更新文件更新文件”对话框，如对话框，如图图7-3-3所示。所示。7.3.3相关知识相关知识该对话框内会显示出与移

25、动文件有链该对话框内会显示出与移动文件有链接的文件的路径与文件名，并询问是否更接的文件的路径与文件名，并询问是否更新对这个文件的链接。单击新对这个文件的链接。单击“更新更新”按钮，按钮，表示更新链接；单击表示更新链接；单击“不更新不更新”按钮，表按钮，表示保持原来的链接。示保持原来的链接。（2）人工检查链接）人工检查链接检查链接的操作方法如下。检查链接的操作方法如下。选中选中“站点站点”窗口的窗口的“站点文件站点文件”栏内栏内的文件夹或文件的图标。的文件夹或文件的图标。单击单击“站点站点”窗口内的窗口内的“站点站点”“检检查站点范围的链接查站点范围的链接”菜单命令，系统开始菜单命令，系统开始自

26、动对选定的文件进行链接的检查，检查自动对选定的文件进行链接的检查，检查后会弹出后会弹出“链接检查器链接检查器”对话框，如图对话框，如图7-3-4所示。所示。图图7-3-4 “链接检查器链接检查器”对话框对话框“链接检查器链接检查器”对话框中的对话框中的“显示显示”下下拉列表框内有拉列表框内有3个选项，选择不同选项时，个选项，选择不同选项时，其下面的显示框内显示的文件内容会不一其下面的显示框内显示的文件内容会不一样。样。3个选项的含义如下。个选项的含义如下。“断掉的链接断掉的链接”：选择该选项后，显示：选择该选项后，显示框内将显示链接失效的文件名与目标文件。框内将显示链接失效的文件名与目标文件。

27、“外部链接外部链接”：选择该选项后，显示框：选择该选项后，显示框内将显示包含外部链接的文件名字与它的内将显示包含外部链接的文件名字与它的路径，但不能对它们进行检查。路径，但不能对它们进行检查。“孤立的文件孤立的文件”：选择该选项后，显示：选择该选项后，显示框内将显示孤立的文件名字与它的路径。框内将显示孤立的文件名字与它的路径。所谓孤立的文件，就是没有与其他文件链所谓孤立的文件，就是没有与其他文件链接的文件。接的文件。“链接检查器链接检查器”对话框的底部给出了相对话框的底部给出了相应的提示信息。应的提示信息。（3）修复链接）修复链接在检查完链接后，可在在检查完链接后，可在“链接检查器链接检查器”

28、对话框中进行修复链接的工作。其操作对话框中进行修复链接的工作。其操作方法如下。方法如下。双击双击“文件文件”面板内的源文件图标，弹面板内的源文件图标，弹出网页编辑器，并打开该文件，产生错误出网页编辑器，并打开该文件，产生错误链接的位置会被选中，利用其链接的位置会被选中，利用其“属性属性”栏栏内的内的“链接链接”栏可重新建立链接。也以可栏可重新建立链接。也以可通过查看它的通过查看它的HTML程序，来检查错误。程序，来检查错误。单击单击“断掉的链接断掉的链接”栏内的目标文件的栏内的目标文件的名字，使它周围出现虚线框和一个文件夹名字，使它周围出现虚线框和一个文件夹按钮，如图按钮，如图7-3-5所示。

29、此时可以修改文件所示。此时可以修改文件的名字与路径，也可以单击文件夹按钮，的名字与路径，也可以单击文件夹按钮，寻找新的目标文件。寻找新的目标文件。图图7-3-5 单击单击“断掉的链接断掉的链接”栏内目标文件名后的效果栏内目标文件名后的效果（4）批量替换链接）批量替换链接当站点的许多文件与一个文件（如一当站点的许多文件与一个文件（如一个外部文件）的链接失效时，不必一个一个外部文件）的链接失效时，不必一个一个地进行修改，可以使用个地进行修改，可以使用“站点站点”面板中面板中的批量替换链接功能。这种链接替换不但的批量替换链接功能。这种链接替换不但对站内目标文件有效，而且对站点外部目对站内目标文件有效

30、，而且对站点外部目标文件也有效。批量替换链接的操作方法标文件也有效。批量替换链接的操作方法如下。如下。单击单击“站点站点”窗口中的窗口中的“站点站点”“改改变站点范围的链接变站点范围的链接”菜单命令，弹出菜单命令，弹出“更更改整个站点链接改整个站点链接”对话框，如图对话框，如图7-3-2所示。所示。在在“将所有链接更改为将所有链接更改为”文本框内输入文本框内输入要修改的原链接目标文件名字，在要修改的原链接目标文件名字，在“新链新链接接”文本框内输入新的链接目标文件名字。文本框内输入新的链接目标文件名字。单击单击“确定确定”按钮，在打开的按钮，在打开的“更新文更新文件件”对话框中，列出了所有与对

31、话框中，列出了所有与“/Th1.htm”文件有链接的文件名字。单文件有链接的文件名字。单击击“更新更新”按钮，表示更新链接；单击按钮，表示更新链接；单击“不更新不更新”按钮，表示保持原来的链接。按钮，表示保持原来的链接。（1）设置预览功能）设置预览功能在在Dreamweaver8中，可以设置中，可以设置20种种浏览器的预览功能，前提是计算机内已安浏览器的预览功能，前提是计算机内已安装了这些浏览器。浏览器预览功能的设置装了这些浏览器。浏览器预览功能的设置步骤如下。步骤如下。2在浏览器中预览网页在浏览器中预览网页在在“首选参数首选参数”对话框的对话框的“分类分类”栏内，栏内，选择选择“在浏览器中预

32、览在浏览器中预览”选项后，该对话选项后，该对话框（右边部分）如图框（右边部分）如图7-3-6所示。所示。图图7-3-6 “在浏览器中预览在浏览器中预览”栏（右边部分）栏（右边部分）在在“浏览器浏览器”栏的显示框内，列出了当栏的显示框内，列出了当前可以使用的浏览器。单击前可以使用的浏览器。单击按钮，可以按钮，可以删除选中的浏览器。单击删除选中的浏览器。单击按钮，可以增按钮，可以增加浏览器。加浏览器。单击单击按钮，可弹出按钮，可弹出“添加浏览器添加浏览器”对对话框，如图话框，如图7-3-7所示。在所示。在“名称名称”文本框文本框内输入要增加的浏览器的名称，在内输入要增加的浏览器的名称，在“应用应用

33、程序程序”文本框内输入要增加的浏览器的程文本框内输入要增加的浏览器的程序路径。再设置成默认的浏览器，单击序路径。再设置成默认的浏览器，单击“确定确定”按钮，完成设置。按钮，完成设置。图图7-3-7 “添加浏览器添加浏览器”对话框对话框 完成设置后，在完成设置后，在“参数选择参数选择”对话框中对话框中单击单击“确定确定”按钮退出。在按钮退出。在“文档文档”面板面板中单击中单击“在浏览器中预览在浏览器中预览/调试调试”按钮按钮，可以看到快捷菜单中增加了新的浏览器，可以看到快捷菜单中增加了新的浏览器名称。名称。选中图选中图7-3-6中所示的中所示的“使用临时文件预使用临时文件预览览”复选框后，可为预

34、览和服务器调试创复选框后，可为预览和服务器调试创建临时备份。如果要直接更新文档，可撤建临时备份。如果要直接更新文档，可撤销对此复选框的选择。销对此复选框的选择。当在本地浏览器中预览文档时，不能当在本地浏览器中预览文档时，不能显示用根目录相对路径所链接的内容（除显示用根目录相对路径所链接的内容（除非选中了使非选中了使“用临时文件预览用临时文件预览”复选框），复选框），这是由于浏览器不能识别站点根目录，而这是由于浏览器不能识别站点根目录，而服务器能够识别。服务器能够识别。若要预览用根目录相对路径所链接的若要预览用根目录相对路径所链接的内容，可将此文件放在远程服务器上，然内容，可将此文件放在远程服务

35、器上，然后单击后单击“文件文件”“在浏览器中预览在浏览器中预览”菜菜单命令来查看它。单命令来查看它。（2）预览网页）预览网页在网页编辑窗口状态下，按在网页编辑窗口状态下，按F12键可以键可以启动第一浏览器显示网页，按启动第一浏览器显示网页，按Ctrl+F12键键可以启动第二浏览器显示网页。可以启动第二浏览器显示网页。7.4 7.4 【案例案例2424】上传上传“跟我学电跟我学电脑脑”网站网站7.4.1学习目标学习目标在在Dreamweaver中将网页发布到网上中将网页发布到网上以后，在以后，在“站点站点”窗口中将显示出服务器窗口中将显示出服务器端站点文件和本地站点文件，如图端站点文件和本地站点

36、文件，如图7-4-1所所示。其中，示。其中，“站点站点”窗口左边显示的是服窗口左边显示的是服务器端站点文件，右边显示的是本地站点务器端站点文件，右边显示的是本地站点文件。文件。图图7-4-1 上传网站后的上传网站后的“站点站点”窗口窗口Dreamweaver的的“站点站点”窗口集成了窗口集成了非常强大的非常强大的FTP功能，可以不必使用其他功能，可以不必使用其他FTP工具，就能实现登录服务器及文件的工具，就能实现登录服务器及文件的上传和下载等操作。在完成本地站点参数上传和下载等操作。在完成本地站点参数设置以后，就可以开始上传文件。设置以后，就可以开始上传文件。7.4.2操作过程操作过程1申请主

37、页空间申请主页空间（1）登录互联网，打开浏览器。在）登录互联网，打开浏览器。在“地址地址”栏中输入栏中输入“http:/”，链接到，链接到“虎翼网虎翼网”。单击。单击“虎翼网虎翼网”（主页）（主页）导航栏中的导航栏中的“虎翼社区虎翼社区”热字，链接热字，链接到到“虎翼社区虎翼社区”栏目，如图栏目，如图7-4-3所示。所示。7.4.3相关知识相关知识图图7-4-3 “虎翼社区虎翼社区”栏目页面的显示效果栏目页面的显示效果（2）单击）单击“虎翼社区虎翼社区”导航栏中的导航栏中的“主页申请主页申请”热字，进入热字，进入“主页申请主页申请”页面。在该页面中，选择页面。在该页面中，选择“免费个免费个人型

38、人型”虚拟主机。然后单击虚拟主机。然后单击“登记注登记注册册”按钮，进入按钮，进入“免费空间注册免费空间注册”（服务条款）页面。（服务条款）页面。（3）仔细阅读网页中列出的服务条）仔细阅读网页中列出的服务条款，确定服务商和用户应该注意的事款，确定服务商和用户应该注意的事项和应尽的义务等。确认无误后单击项和应尽的义务等。确认无误后单击“同意同意”按钮，进入按钮，进入“注册信息注册信息”页页面，如图面，如图7-4-4所示。所示。图图7-4-4 “注册信息注册信息”网页（部分）的显示效果网页（部分）的显示效果（4）在该页面内依次输入注册信息）在该页面内依次输入注册信息后，单击后，单击“下一步下一步”

39、按钮，进入进一按钮，进入进一步设置的页面。在该页面中，可以设步设置的页面。在该页面中，可以设置出生日期、个人爱好等信息。设置置出生日期、个人爱好等信息。设置完成后，单击完成后，单击“下一步下一步”按钮，进入按钮，进入“安装安装DIY吧吧”页面。在该页面中单页面。在该页面中单击击“下一步下一步”按钮，即可自动安装该按钮，即可自动安装该软件，并且完成申请主页空间的操作。软件，并且完成申请主页空间的操作。（5）重新回到）重新回到“虎翼社区虎翼社区”栏目页栏目页面，在面，在“免费用户登录免费用户登录”栏中输入用栏中输入用户名和密码，单击户名和密码，单击“登录登录”按钮，即按钮，即可查看主页空间的相关信

40、息，如图可查看主页空间的相关信息，如图7-4-5所示。所示。图图7-4-5 “个人信息个人信息”页面的显示效果页面的显示效果（1）打开）打开“站点定义为站点定义为”（高级）对（高级）对话框，在话框，在“分类分类”栏中选择栏中选择“远程信远程信息息”选项，此时的选项，此时的“站点定义为站点定义为”对对话框如图话框如图7-4-6左图所示。左图所示。（2）在图）在图7-4-6左图所示的对话框中的左图所示的对话框中的“远程信息远程信息”栏内，选择栏内，选择“访问访问”下下拉列表框内的选项，可以设置本地站拉列表框内的选项，可以设置本地站点的服务器访问方式。其中点的服务器访问方式。其中3个选项的个选项的含

41、义如下。含义如下。2定义服务器信息定义服务器信息图图7-4-6 选择选择“远程信息远程信息”选项后的选项后的“站点定义为站点定义为”对话框和对话框和“FTP”选项中的内容选项中的内容“无无”选项：仅用于本地站点，与服务器选项：仅用于本地站点，与服务器没有连接。没有连接。“FTP”选项：通过选项：通过FTP连接到服务器上，连接到服务器上，这是通常采用的方式。此处选择此选项。这是通常采用的方式。此处选择此选项。“本地本地/网络网络”选项：通过局域网连接到选项：通过局域网连接到服务器上。服务器上。（3）选择）选择“FTP”选项后，该对话框选项后，该对话框如图如图7-4-6右图所示。其中各选项的含右图

42、所示。其中各选项的含义如下。义如下。“FTP主机主机”文本框：输入网站上传时的文本框：输入网站上传时的FTP主机地址，即服务器地址。注意：前主机地址，即服务器地址。注意：前面不要加面不要加“ftp:/”字符。此处输入字符。此处输入“”。“保存保存”复选框：选择它后，登录名称和复选框：选择它后，登录名称和登录密码会被自动保存。此处选中该选项。登录密码会被自动保存。此处选中该选项。“使用使用PassiveFTP”复选框：选择它后，复选框：选择它后，将使用将使用FTP被动方式链接。被动方式链接。“使用防火墙使用防火墙”复选框：选择它后，使复选框：选择它后，使用防火墙，通常在连接的服务器有防火墙用防火

43、墙，通常在连接的服务器有防火墙保护时才选中它。此处选中该选项。保护时才选中它。此处选中该选项。完成上述设置后，单击完成上述设置后，单击“确定确定”按钮，按钮，返回返回“编辑站点编辑站点”对话框。再单击对话框。再单击“完成完成”按钮，返回按钮，返回“站点站点”窗口。窗口。（4）设置防火墙参数）设置防火墙参数如果在如果在“站点定义为站点定义为”对话框中选中对话框中选中了了“使用防火墙使用防火墙”复选框，就应该在连接复选框，就应该在连接远程服务器以前进行防火墙参数的设置。远程服务器以前进行防火墙参数的设置。单击单击“编辑编辑”“首选参数首选参数”菜单命菜单命令，弹出令，弹出“首选参数首选参数”对话框，在对话框，在“分类分类”栏中选中栏中选中“站点站点”选项，如图选项，如图7-4-7所示。所示。在对话框右边的在对话框右边的“防火墙主机防火墙主机”文本框内，文本框内，输入服务器的地址。单击输入服务器的地址。单击“确定确定”按钮，按钮，完成设置防火墙参数操作。完成设置防火墙参数操作。图图7-4-7 选择选择“站点站点”选项后的选项后的“首选参数首选参数”对话框对话框