Dreamweaver 8网页制作实例短训教程 课件 电子教案.ppt

Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 Dreamweaver 8网页制作实例短训教程 机械工业出版社同名教材 配套电子教案 2007.1 本课通过介绍Dreamweaver 8的编辑环境，让设计者对代码的运作方式有个基本的了解，并学会如何使用代码片段及如何创建代码片段。学习中要注意上机实际操作与理论的结合，做到如下3点： ① 对每一种操作方法都要上机多实践。 ② 上机前进行预习，课后作业认真完成。 ③ 结合一些基本概念，进行上机操作练习。 6.1 课前导读 6.2.1 设置编码环境 用户可以在Dreamweaver 8中修改编码环境使之适合自己的工作方式。例如，可以更改查看代码的方式、设置不同的键盘快捷方式、或导入并使用用户喜欢的标签库。 1．使用面向编码器的工作区 用户可以使用一个与Macromedia HomeSite中的工作区外观相似的工作区，其面板组停靠在主窗口的左侧而不是右侧。如果用户需要将默认的“设计器”编辑模式切换为“编码器”编辑模式，执行“窗口”→“工作区布局”→“编码器”命令，即可将编辑状态切换为“编码器”编辑模式。在这种工作区布局中，属性面板默认情况下处于折叠状态，“文档”窗口默认情况下以“代码”视图显示。 6.2 课堂教学 6.2.1 设置编码环境 2．设置代码查看选项 用户可以通过“查看”→“代码视图选项”菜单来设置文本换行、显示代码行号、高亮显示无效代码、代码元素的语法颜色、缩进和显示隐藏字符等。 要设置“代码”视图和代码检查器的选项，可以执行以下操作： ① 切换为“代码”视图或代码检查器中查看文档。 ② 执行下列操作之一： 选择“查看”→“代码视图选项” 。 单击位于“代码”视图顶部工具栏上的“视图选项”按钮。 6.2 课堂教学 6.2.1 设置编码环境 ③ 要启用或禁用以下任何一个选项，可以从菜单中选中该项目。 自动换行：对代码进行换行，以便用户查看代码时不需要水平滚动。此选项不插入换行符；它只是使代码更易于查看。 行数：在代码的旁边显示行号。 隐藏字符：显示用来替代空白处的特殊字符。 高亮显示无效代码：使Dreamweaver以黄色高亮显示所有无效的HTML代码。当选择一个无效的标签时，属性面板显示有关如何更正该错误的信息。 语法颜色：启用或禁用代码颜色。 自动缩进：当用户在编写代码过程中按〈Enter〉键时使代码自动缩进。新一行的缩进级别与上一行的相同。 6.2 课堂教学 6.2.1 设置编码环境 3．自定义快捷键 用户可以在Dreamweaver中使用自己喜欢的键盘快捷方式。使用快捷键编辑器可以创建自己的快捷键，包括代码片断的快捷键。用户也可以在快捷键编辑器中删除快捷键、编辑现有的快捷键以及选择一组预定义的快捷键。 要自定义快捷键，可以执行以下操作： ① 选择“编辑”→“快捷键”，弹出“快捷键”对话框。 ② 添加、删除或编辑快捷键。 ③ 单击“确定”按钮。 6.2 课堂教学 6.2.2 在Dreamweaver中编写代码 Dreamweaver 8提供了功能全面的编码环境，这一编码环境是针对各种Web开发类型而专门设计的。Dreamweaver 8提供了多种功能，可以帮助用户高效率地编写和编辑代码。 1．使用代码提示 代码提示功能有助于用户快速插入和编辑代码，并且不出差错。当用户在“代码”视图中键入某些字符时（例如标签或属性或CSS属性名称的开始几个字母时），将出现一个列表，列出完成输入所需的建议选项。用户可以使用该功能插入或编辑代码，或只是查看某一标签的可用属性、某一函数的可用参数或某一对象的可用方法。 6.2 课堂教学 6.2.2 在Dreamweaver中编写