2.1创建本地站点及文件操作(课件）-高二《网页设计与制作》同步教学（北京理工版）

项目活动二　健康美丽网站设计:Dreamweaver CS６入门 任务一　创建本地站点及文件操作 任务二　页面布局 任务三　页面属性及网页文件头设置 返回 1 任务一　创建本地站点及文件操作　 一、站点目录结构及本地站点的创建 创建网站的第一步是确定本地站点的目录结构, 并准备好相应的素材文件, 然后在Ｄｒｅａｍｗｅａｖｅｒ 中定义站点并创建网页, 下面将介绍健康美丽网站的目录结构及创建本地站点的方法. １) 打开“我的电脑”, 任意选择一个本地磁盘, 如Ｄ 盘, 在Ｄ 盘中新建文件夹, 并将其命名为“ｂｅａｕｔｉｆｕｌｈｅａｌｔｈ”. 打开新建的“ｂｅａｕｔｉｆｕｌｈｅａｌｔｈ” 文件夹, 在里面分别新建“ｐｉｃ” “ｃｓｓ” 和“ｆｌａｓｈ” 文件夹(这是制作网站的常用操作, 便于分门别类地管理站点文件及文件夹, 其中“ｐｉｃ” 文件夹用于存放网页中用到的图像文件, “ｃｓｓ” 文件夹用于存放网页的样式文件, “ｆｌａｓｈ” 文件夹用于存放Ｆｌａｓｈ 动画). 下一页 返回 任务一　创建本地站点及文件操作　 ２) 启动Ｄｒｅａｍｗｅａｖｅｒ ＣＳ６, 在菜单栏中单击“站点”, 选择“新建站点” 命令, 弹出如图２ －１ 所示的“站点设置对象” 对话框. ３) 在“站点名称” 文本框中填写站点名称“ｂｅａｕｔｉｆｕｌｈｅａｌｔｈ”, 这里的名称可以是中文名称. ４) 单击“本地站点文件夹” 文本框右侧的文件夹图标, 弹出“选择根文件夹” 对话框, 如图２ － ２ 所示. 选择Ｄ 盘中新建的文件夹“ｂｅａｕｔｉｆｕｌｈｅａｌｔｈ”, 单击“打开” 按钮,再继续单击“选择” 按钮, 选择本地根文件夹, 效果如图２ －３ 所示. ５) 单击“站点设置对象” 对话框左侧的“高级设置” 选项, 选择“本地信息”, 单击“默认图像文件夹” 文本框右侧的文件夹图标, 选择Ｄ 盘中新建的“ｂｅａｕｔｉｆｕｌｈｅａｌｔｈ”文件夹下的“ｐｉｃ” 文件夹, 单击“选择” 按钮, 选择默认图像文件夹, 如图２ －４ 所示. 上一页 下一页 返回 任务一　创建本地站点及文件操作　 ６) 单击“保存” 按钮, 即完成站点的创建, 此时在Ｄｒｅａｍｗｅａｖｅｒ 主窗口的右侧会显示“文件” 面板, 如图２ －５ 所示. 二、新建网页 １) 打开“文件” 面板, 单击“文件” 面板上的 按钮, 选择“文件” → “新建文件” 命令, 如图２ －６ 所示, 即可新建一个空白的网页文件. 此时新建文件的名称处于可编辑状态, 默认为ｕｎｔｉｔｌｅｄ.ｈｔｍｌ, 一般需要将第一个文件作为主页并重新命名为ｉｎｄｅｘ.ｈｔｍｌ, 如图２ －７ 所示. ２) 双击ｉｎｄｅｘ.ｈｔｍｌ 文件, 进入此文件的网页编辑状态, 可以编辑网页效果. 上一页 返回 图２ －１　“站点设置对象” 对话框 返回 图２ －２　 “选择根文件夹” 对话框 返回 图２ －３　“选择根文件夹” 效果图 返回 图２ －４　“默认图像文件夹” 设置对话框 返回 图２ －５　站点管理窗口 返回 图２ －６　执行“新建文件” 命令 返回 图２ －７　新建主页文件管理窗口 返回 $