《互联网应用初级标准教程第七章》由会员分享，可在线阅读，更多相关《互联网应用初级标准教程第七章（47页珍藏版）》请在金锄头文库上搜索。
1、第7章 长缨在手,7.1 任务一：把“梦工厂”请回家 7.2 任务二：给网站在你的电脑上找个家 7.3 任务三：万丈高楼平地起 7.4 小结,7.1 任务一：把“梦工厂”请回家,7.1.1 获取Dreamweaver 8简体中文版 （1）打开IE浏览器，在地址栏里输入，就可以进入如图7-2所示的Google主页面了。在搜索栏里输入两个关键词：“Dreamweaver 8试用版”和“下载”，单击搜索栏下方的【Google搜索】按钮。 （2）这时，Google搜索引擎就为我们搜索出很多下载的网址，如图7-3所示。,下一页,7.1 任务一：把“梦工厂”请回家,7.1.2 安装Dreamweaver
2、8简体中文版 （1）双击该图标，系统会自动进行解压缩。压缩过程的界面如图7-4所示。 （2）自动解压缩完毕后，就出现正式安装界面了，如图7-5所示。单击【下一步】按钮，将会自动进入安装过程。 （3）首先出现的是许可证协议对话框，如图7-6所示。它询问是否遵循其协议。选择【我接受该许可证协议中的条款】复选框，才可以接着安装。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,（4）接着就要考虑该把Dreamweaver安装到哪里了。 （5）图7-8这个对话框中的内容将在今后的课程中学到，现在需要做的只是单击【下一步】按钮就可以了。 （6）接下来也很简单，如图7-9所示，单击【安装】按钮，这时D
3、reamweaver 8就开始自动安装了。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,（7）图7-10中间是安装进度条，它能够告诉我们程序安装的进度，看来软件的安装还得耐心等一会儿。 （8）经过一阵等待之后，会看到如图7-11所示的对话框。单击【完成】按钮，安装就顺利完成了。 （9）安装完成后，会出现如图7-12所示的一个窗口。窗口中有Dreamweaver运行图标。双击这个运行图标，我们就可以使用Dreamweaver 8了。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,7.1.3 卸载Dreamweaver （1）在Windows中打开控制面板。在弹出的控制面板窗口中双击
4、【添加和删除软件】图标。 （2）弹出的对话框是添加和删除对话框，该对话框的列表框中列出的是已经安装的程序。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,7.1.4 认识我们的工作台 程序终于成功安装了，大家一定迫不及待地要学着使用它了吧。现在就让我们来启动Dreamweaver 8的工作界面。 单击运行图标，第一次运行Dreamweaver 8时，将会有一个选择工作界面的对话框，如图7-14所示。我们默认选择左边的【设计器】工作模式，然后单击【确定】按钮。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,图7-15显示了Dreamweaver 8的启动画面，变形的绿色字母D从朴素的
5、统一风格中流露出其跳跃活泼的性格。观察一下，发现版本号由上个版本的2004 MX改为8.0，相信也是为了跟Studio 8保持一致。插入栏包含用于将各种类型的“对象”（如图像、表格和层）插入到文档中的按钮。 文档窗口显示当前创建和编辑的文档。我们就是在这里制作和编辑网页的。,下一页,上一页,7.1 任务一：把“梦工厂”请回家,文件面板用来管理文件和文件夹，无论它们是Dreamweaver 站点的一部分还是在远程服务器上，都可用以访问本地磁盘上的全部文件，非常类似于Windows 资源管理器，如图7-20所示。 面板组是分组在某个标题下面的相关面板的集合。若要展开一个面板组，可单击组名称左侧的展
6、开箭头；若要取消停靠一个面板组，可拖动该组标题条左边缘的手柄。,返 回,上一页,7.2 任务二：给网站在你的电脑上 找个家,7.2.1 建立根文件夹 首先，我们在F盘建立一个根文件夹。当然大家也可以建立在别的盘里。 （1）双击桌面上的【我的电脑】图标，打开F盘。单击鼠标右键，选择。在弹出的菜单中选择 选项。 （2）这时，F盘中会出现一个【新建文件夹】图标。将文件夹命名为你想要的站点名称。在这里，我们不妨以“电脑硬件”来命名我们的新站点。将图标名“新建文件夹”改为“电脑硬件”即可，如图7-24所示。,下一页,7.2 任务二：给网站在你的电脑上 找个家,7.2.2 在Dreamweaver中定义文
7、件夹 （1）打开Dreamweaver，在菜单栏上单击【站点】菜单，选择【管理站点】选项，如图7-25所示。 （2）选择【管理站点】选项后，出现如图7-26所示的【管理站点】对话框。 （3）在【管理站点】对话框中，单击 按钮，选择 选项。,下一页,上一页,7.2 任务二：给网站在你的电脑上 找个家,（4）现在出现的是基本属性对话框，如图7-27所示。我们需要给站点起一个名字，可以起任意一个你所喜欢的名字。 （5）在这里，我们为网站起名为“电脑硬件”。为站点起名非常简单，在【您打算为您的站点起什么名字】这句话下面把“未命名站点1”改为“电脑硬件”就可以了。然后单击【下一步】按钮。 （6）弹出对话
8、框，如图7-28所示，选择是否使用服务器技术。,下一页,上一页,7.2 任务二：给网站在你的电脑上 找个家,（7）在图7-29所示的对话框中，选择中【编辑我的计算机上的本地副本，完成后再上传到服务器】单选按钮。 （8）这时弹出如图7-30所示的对话框，询问要把这些网页放到服务器的哪个位置。 （9）从图7-31所示的对话框中可以看到站点的一些基本信息。单击【完成】按钮。 （10）接着，在如图7-32所示的【管理站点】对话框中单击左下方的【完成】按钮，的新站点就定义好了。,下一页,上一页,7.2 任务二：给网站在你的电脑上 找个家,7.2.3 新建网页文件和文件夹（1）在站点面板中，可以看到新建的
9、“电脑硬件”站点。 （2）【新建文件】命令会增加一个未命名的文件，如图7-34所示。 （3）给它取名叫“home”，输入“home.htm”。 （4）还可以用同样的方法再增加一个新文件，命名为“CPU”。,返 回,上一页,7.3 任务三：万丈高楼平地起,7.3.1 白手起家 1创建空白文档 （1）在本地站点创建完成以后，如果你需要创建空白的HTML文档，可以选择【文件】【新建】命令，此时将会弹出一个如图7-36所示的选择对话框。 （2）在文档标题栏输入框中输入文档名称，然后双击这个文档图标即可打开空白文档。 （3）在Dreamweaver中新建的空白HTML文档表面上是空的，实际上与之相对应的
10、HTML文件并不是空白的,下一页,7.3 任务三：万丈高楼平地起,2使用已有文件创建文档 除了创建新的空白文档之外，还可以打开计算机或光盘中已经有的HTML文档进行修改和编辑，然后保存到自己的站点中。 3保存文档 在通过使用以上任何方法创建新的HTML文档后，或对已经存在的文档编辑和修改后，我们需要将其保存到所创建的本地站点文件夹中，对文档的修改进行随时存盘，可以减少计算机断电或其他人为误操作所导致的文件损失。,下一页,上一页,7.3 任务三：万丈高楼平地起,4另存网页文档 如果当前的文档是在已有的HTML文档基础上创建的，那么对其进行保存和对新建文档的保存就不一样了。这时需要对其进行“另存为
11、”的操作，因为只有通过这样的操作才可以将文档保存到本地文件夹中。 5打开文档 将HTML文档保存到本地文件夹后，如果需要再次使用或修改的话，我们需要将其再次打开。实际上，在前面“使用已有文件创建文档”中已经讲述了这一点。,下一页,上一页,7.3 任务三：万丈高楼平地起,下面将再次练习打开一个HTML文档。 （1）选择【文件】【打开】命令，将打开【打开】对话框。 （2）在【打开】对话框中选择要打开的文档（如果要打开本地站点中的文档，可以直接到站点文件中进行选择），然后双击文档图标，或单击对话框中的【打开】按钮即可。 6网页浏览 做好了的网页怎么在浏览器中预览呢？在Dreamweaver中可以随时
12、在指定的浏览器中来浏览你的网页。,下一页,上一页,7.3 任务三：万丈高楼平地起,7.3.2 添砖加瓦 1改变页面标题 页面标题指的是当浏览器打开页面时出现在浏览器标题栏中的内容。一般网页都应该设置网页标题，页面标题可以帮助访问者跟踪他们正在查看的内容。如果还没有给网页设置标题，则该页面在浏览器中显示时，标题栏将显示“无标题文档”。,下一页,上一页,7.3 任务三：万丈高楼平地起,2背景的格调 3写点内容看看 设定好网页的背景颜色和背景图像后，就开始给我们的网页添砖加瓦，下面学习在网页中加入最基本的内容文字。 4黑白到彩色的飞跃,下一页,上一页,7.3 任务三：万丈高楼平地起,5定义默认的文本
13、颜色 我们在浏览网页的时候，经常遇到点击后的文字会变成另外一种颜色的现象。在【页面属性】对话框中，可以定义文本、链接、访问过的链接和活动链接的默认颜色，或选择一个预设的配色方案以定义页面背景和文本颜色。,下一页,上一页,7.3 任务三：万丈高楼平地起,6可视化辅助工具 和其他设计软件相似，在 Dreamweaver中有许多辅助设计网页文档的功能，使用这些具有辅助功能的工具可以使网页的页面布置更直观。Dreamweaver提供了几种可视化辅助工具以帮助你设计文档和估计文档在浏览器中的显示情况。主要包括以下几种。,返 回,上一页,7.4 小结,通过本章的学习，应该掌握下载、安装以及卸载Dreamw
14、eaver软件的方法。并且学会定义本地站点，网页文档的基本操作，标尺、网格的使用和设置以及浏览网页文档等操作。下面的练习可以抽查一下自己的掌握情况。,返 回,图7-2 Google搜索引擎,返 回,图7-3 Google搜索结果,返 回,图7-4 安装文件解压缩,返 回,图7-5 正式安装界面,返 回,图7-6 许可证协议对话框,返 回,图7-8 编辑器对话框,返 回,看不懂！,图7-9 开始安装文件,返 回,图7-10 安装进度,返 回,图7-11 安装完成,返 回,图7-12 创建快捷方式,返 回,图7-20 文件面板,返 回,图7-24 建立根文件夹,返 回,图7-25 单击【站点】菜单
15、,返 回,图7-26 【管理站点】对话框,返 回,图7-27 基本属性对话框,返 回,好了，在这里把站点的名字修改成“电脑硬件”，然后单击【下一步】按钮。,图7-28 设置是否使用服务器技术,返 回,目前还看不懂这些什么意思，还是不用算了。,图7-29 编辑站点的位置,返 回,图7-30 连接远程服务器,返 回,远程服务器什么意思啊？没有吧？拖下来看看，还好菜单里面有个“无”的，就选它了！,图7-31 站点定义总结,返 回,图7-32 新建站点完成,返 回,图7-34 未命名文件,返 回,图7-36 新建文档,返 回,图7-14 选择工作界面,返 回,图7-15 Dreamweaver 8启动界面,返 回,
