01在Dreamweaver中创建站点教学课件 高教版 中职 网页设计与制作（Dreamweaver CS5） .ppt

01在Dreamweaver中创建站点教学课件 高教版 中职 网页设计与制作（Dreamweaver CS5）网站的本地站点静态网站制作教学资源课件静态网站制作教学资源课件AdobeDreamweaverCS5是一款集网页制作和管理网站于一身的所见即所得网页编辑器。DreamweaverCS5是第一套针对专业网页设计师特别开发的视觉化网页开发工具，它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，利用它各个层次的开发人员和设计人员都能够快速地制作出跨越平台限制和跨越浏览器限制的网页。设计视图创建本地站点 网站是网页的容器，网页之间通过各种链接相互关联，从而描述相关的主题来实现共同的目的。因此，在建立网站时，要先设计和规划好整个站点再进行具体的网页制作。创建一个网站，一般是先在本地（当前计算机上）将整个网站完成，进行调试后再将网站上传到Web服务器上。本地站点也称为网站的工作区域，它由与网站关联的所有文件和文件夹组成，这些文件和文件夹镜像远程站点上的文件和文件夹。创建本地站点一、创建范例网站“石家庄市第二职业中专学校网站”的本地站点。1、先在D盘根目录下创建“mysite1”文件夹，并在其中创建“images”、“scripts”、“styles”子文件夹。打开本书资料包将“资料包资料包实例素材实例素材chapter2shili1”中的文件分别存放到相应的位置。注意：注意：在以后的操作中都要先将用到的素材文件复制到相应的站点子文件夹中，再将素材用到网页中。常用文件夹介绍如下：images：存放本网站的公用图片文件styles：存放样式表文件及样式专用图片文件scripts：存放JavaScript程序文件videos：存放视频素材文件sounds：存放声音素材文件注意：注意：站点中所有的文件夹及文件都不能用中文命名，否则可能产生网页无法正常显示的现象，初学者要特别注意这一点创建本地站点2、打开Dreamweaver后，在欢迎屏幕“新建”栏中的“Dreamweaver站点”命令，也可以单击“站点”菜单中的“新建站点”命令，打开“站点设置对象”对话框，如图2.5所示。创建本地站点创建本地站点3、在“站点名称”文本框中为站点起一个名字，输入站点名称“石家庄市第二职业中专学校网站”。在“本地站点文件夹”文本框中输入“d:mysite1”，以指明网站中使用的所有文件和资源在当前计算机中的存放位置。注意：注意：站点名称只是一个逻辑名称，它相当于一个项目名称，只是为了方便对站点中的文件和文件夹进行管理。4、单击左侧例表框中的“高级设置”在下级功能列表中选择“本地信息”，在右侧功能区“默认图像文件夹”旁的“浏览文件夹”按钮，选择“images”文件夹，将站点根文件夹中的“images”文件夹指定为图像文件的默认保存位置。创建本地站点创建本地站点5、对于站点的HTTP地址（WebURL），因为我们现在只是要建一个在本地计算机中存储的站点，所以暂时不进行设置，将在第六章如何发布网站中再具体介绍。6、单击“保存”按钮，打开“管理站点”对话框，如图2.8所示，单击“完成”按钮，一个本地站点就创建完成了，这时Dreamweaver工作界面的“文件”面板中将显示“石家庄市第二职业中专学校网站”的本地结构，如图2.9所示。练习练习1：为本章的练习创建本地站点，站点名称为“练习”，站点根文件夹为“d:lianxi”，在站点根文件夹中创建“images”、“scripts”、“styles”子文件夹，并指定网站中的默认图像文件夹是“images”。将本书素材包中的“实例素材”中“chapter2”子文件夹中的“lianxi1”中的图像文件复制到本站点的“images”文件夹中，为以后的练习做准备。练习选择“站点”菜单中的“管理站点”命令，打开“管理站点”对话框，从“管理站点”对话框中选择要修改的站点，然后单击“编辑”按钮，打开上图中的“站点设置对象”对话框，就可以像定义站点一样编辑相关选项。编辑站点如果不再需要使用 Dreamweaver 中的某一站点，则可以从站点列表中将该站点删除。删除站点只是删除了Dreamweaver同本地站点中之间的关联，但在当前计算机中的站点文件夹及所有文件不会被删除。从站点列表中删除 Dreamweaver 站点应执行以下操作：1、单击“站点”菜单中的“管理站点”命令，打开“管理站点”对话框。2、选择要删除的站点名称，单击“删除”按钮，将弹出一个系统提示框，要求确认删除。删除站点