2.1.3-Dreamweaver CS5站点的修改和编辑（教案）-《网页设计与制作》同步教学（电子工业出版社）

教案 编号：PTzZ-67 流水号：18 （首页）共 4页 课程 《网页设计与制作Dreamweaver CS5》 一体化 理论 章节（课题）及内容 Dreamweaver CS5站点的修改和编辑 班级日期 中职 2024.05 授课方式 讲授与任务驱动相结合 课时 1 作业题数 1 拟用时间 40分钟 教学目标 使学生理解以下理论知识： · 学会在Dreamweaver CS5中对已创建的站点进行修改和编辑； · 掌握站点文件的添加、删除、重命名和移动； · 熟悉站点属性的修改，包括站点名称、本地根文件夹和默认文档等。 教学资源准备 多媒体设备 课本教材 学生练习素材 教学重点 1. 站点文件的修改和编辑； 2. 站点属性的修改； 3. Dreamweaver CS5站点管理功能的使用。 教学难点 1. 如何有效地修改和编辑站点文件； 2. 如何使用Dreamweaver CS5的站点面板进行文件操作。 教学方法 讲授法、任务驱动法、演示法、体验探究法等。 1. 直观展示法：通过教师演示和学生观察，使学生了解站点修改和编辑的方法； 2. 实践操作法：通过学生自己动手实践，掌握站点修改和编辑的技巧； 3. 小组合作法：鼓励学生分组合作，共同解决学习中遇到的问题。 授课教师： 审阅签名： 教学过程 教学活动内容 时间分配教学方法 课前导入 1. 简要回顾Dreamweaver CS5中创建本地站点的方法； 2. 提问学生对Dreamweaver CS5站点管理的了解程度，激发学生的学习兴趣。 2分钟 讲授新课 练习指导 在Dreamweaver CS5中对已创建的站点进行修改和编辑是网站开发过程中的常见任务。以下是在Dreamweaver CS5中进行站点修改和编辑的详细步骤： ### 打开站点 1. **启动Dreamweaver CS5**。 2. 从“文件”菜单中选择“打开”，然后选择“站点”来打开你的本地站点。 ### 修改站点属性 1. 在“站点”面板中，右键点击站点名称，选择“站点设置”或直接在站点名称上双击。 2. 在弹出的“站点设置”对话框中，你可以修改站点名称、本地根文件夹、默认文档等属性。 3. 完成修改后，点击“确定”保存设置。 ### 添加、删除、重命名和移动文件或文件夹 1. 在“站点”面板中，你可以直接拖放文件或文件夹来移动它们。 2. 要添加新文件，右键点击站点根目录，选择“新建”>“文件”或“新建”>“文件夹”。 3. 要删除文件或文件夹，选中它们，然后按键盘上的“Delete”键或在右键菜单中选择“删除”。 4. 要重命名文件或文件夹，选中它们，然后按键盘上的“F2”键或在右键菜单中选择“重命名”。 ### 编辑文件 1. 双击你想要编辑的文件，Dreamweaver CS5将在文档窗口中打开它。 2. 在这里，你可以直接编辑HTML、CSS、JavaScript等代码，或者使用视觉编辑模式来设计网页。 3. 编辑完成后，保存文件（Ctrl+S 或 Cmd+S）。 ### 上传和下载文件 1. 在“站点”面板中，选中你想要上传或下载的文件。 2. 点击“上传”按钮将文件上传到远程服务器，或点击“下载”按钮将远程服务器上的文件下载到本地。 ### 同步本地和远程站点 1. 在“站点”面板中，右键点击站点名称，选择“同步”。 2. 在弹出的“同步”对话框中，选择你想要同步的选项（如“同步本地站点到远程站点”），然后点击“预览”以查看即将进行的更改。 3. 如果没有问题，点击“同步”按钮进行同步。 通过上述步骤，你应该能够在Dreamweaver CS5中熟练地对已创建的站点进行修改和编辑。记得实践和探索软件的其他功能，以便更全面地了解Dreamweaver CS5的强大能力。 10分钟 7分钟 自主学习 8分钟 练习训练 · 在Dreamweaver CS5中打开一个已创建的本地站点； · 修改站点名称、本地根文件夹和默认文档； · 在站点中添加、删除、重命名和移动文件或文件夹； · 使用站点面板上传和下载文件，以及同步本地和远程站点 12分钟 布置作业 1. 打开一个已创建的本地站点； 2. 修改站点属性，包括站点名称、本地根文件夹和默认文档； 3. 在站点中添加一个新的页面，并对其进行编辑； 4. 使用站点面板将修改后的站点文件上传到指定的网络服务器。 1分钟 总结回顾 1. Dreamweaver CS5中站点修改和编辑的方法； 2. 站点属性的修改； 3. Dreamweaver CS5