240 likes | 439 Views
第 03 章 创建与设置文档. 文档的创建与设置是 Dreamweaver 的基本操作。用户创建了本地站点后,就可以创建文档并将其保存在站点文件夹中。用户可以通过 Dreamweaver 8 所提供的友好操作界面方便地制作出包含文本、图像、动画、录像以及链接的文档。同时, Dreamweaver 会在用户创建文档的同时自动生成相应的 HTML 代码。 。. 3.1 教学目标. 掌握知识: 通过本章的学习,读者应掌握在 Dreamweaver 8 中创建网页文档、编辑文档内容,设置文档属性以及使用网页可视化工具的方法。
E N D
第03章 创建与设置文档 文档的创建与设置是Dreamweaver的基本操作。用户创建了本地站点后,就可以创建文档并将其保存在站点文件夹中。用户可以通过Dreamweaver 8所提供的友好操作界面方便地制作出包含文本、图像、动画、录像以及链接的文档。同时,Dreamweaver 会在用户创建文档的同时自动生成相应的HTML代码。。
3.1 教学目标 • 掌握知识:通过本章的学习,读者应掌握在 Dreamweaver 8中创建网页文档、编辑文档内容,设置文档属性以及使用网页可视化工具的方法。 • 重点学习:本章重点讲解了创建、打开、设置和保存文档的操作方法,课后读者应结合上机操作进行强化练习。
3.2 理论指导 • 创建网页文档 • 打开和保存网页文档 • 设置文档属性 • 设置颜色 • 选择文档中的元素 • 使用可视化向导设计网页 • 查看和编辑头部内容
3.2.1创建网页文档 在Dreamweaver 8中用户可以通过3种方式创建文档:创建新的空白文档、创建以模板为基础的文档,以及创建基于Dreamweaver 8设计文件的文档。 • 创建空白文档 • 创建基于Dreamweaver 8设计文件的文档 • 创建模板文档 • 通过“导入”创建文档
选择“文件”|“新建”命令或按Ctrl+N键,在打开的“新建文档”对话框中选择要创建的文档类型后,单击“创建”按钮即可 在Dreamweaver 8中创建一个空白网页文档。
在“新建文档”对话框中选择合适的设计文件,作为要设计页面的“模板”,然后单击”创建“按钮,可以创建基于Dreamweaver 8设计文件的网页文档。
Dreamweaver的模板是一种特殊类型的文档,用于创建具有相同页面布局的统一页面。模板设计者通过设计页面布局,并在模板中设置可以进行编辑的区域供用户使用。 • 用户要在Dreamweaver 8的文档窗口中创建模板文档,可以使用以下两种方法。 • 在文档窗口中选择“文件”|“新建”命令或按Ctrl+N键,打开“新建文档”对话框,在打开的对话框中选择“基本页”选项,然后在对话框的“基本页”列表中选择“HTML模板”选项,并单击“创建”按钮。 创建基于Dreamweaver 8设计文件的文档 • 创建基于现有文档的模板:在文档窗口中选择“文件”|“新建”命令或按Ctrl+N键,打开“新建文档”对话框,在打开的对话框中选择“页面设计”及“页面设计(有辅助功能的)”这两个选项,然后在对话框中间列表中选择适合的选项,并在对话框右下方的“创建”选项区域中选择“模板”单选按钮,然后单击“创建”按钮。
如果要使用Dreamweaver的“导入”功能创建网页文档, 必须先新建一个HTML文件,然后选择“文件”| “导入”命令,将相应类型的文件导入到文档中。
3.2.2 打开和保存网页文档 在使用Dreamweaver 8制作网页时,打开和保存文档是最常用的操作命令,用户可以通过执行这些命令,实现不同文档之间的调用和网页效果的保存。 • 打开现有文档 • 打开最近使用的文档 • 保存文档
选择“文件”|“打开”命令或按Ctrl+O键,在打开的“打开”对话框中选择需要打开的网页文件后,单击“打开”按钮即可打开一个现有的网页文档。选择“文件”|“打开”命令或按Ctrl+O键,在打开的“打开”对话框中选择需要打开的网页文件后,单击“打开”按钮即可打开一个现有的网页文档。
选择“文件”|“打开最新的文件”命令,从弹出的菜单中选择Dreamweaver 8最近打开过的文档名称即可打开Dreamweaver最近被打开过的网页文档。
要保存制作好的网页,可以选择“文件”|“保存”命令,然后在打开的“另存为” 对话框中单击“保存”按钮 即可。
3.2.3 设置文档属性 要修改 Dreamweaver中被打开的网页文档属性,可以选择“修改”|“页面属性”命令,打开“页面属性”对话框进行设置。
3.2.4 设置颜色 在制作网页的过程中,使用颜色美化网页效果是必不可少的操作,在Dreamweaver 8中用户可以借助属性检查器非常方便地修改各种网页元素的颜色。 • 认识网页安全色 • 定义文本颜色
网页安全色指的是以256色模式运行时,无论在 Windows系统的Microsoft Internet Explorer中,还是在 Macintosh 系统的Netscape Navigator中都显示相同的颜色。用户在制作网页时,共有 216 种常见颜色,而且任何结合了 00、33、66、99、CC 或 FF 对(RGB的相应值分别为 0、51、102、153、204 和 255)的十六进制值都代表网页安全色。 在Dreamweaver中,“立方色”和“连续色调”调色板使用的是216色的网页安全调色板,从这些调色板中选择颜色会显示颜色的十六进制值。
如果要设置网页文档中文本对象的颜色,用户可以选择“修改”|“页面属性”命令,打开“页面属性”对话框,在“分类”列表框中选择“外观”和“链接”选项,分别进行设置。如果要设置网页文档中文本对象的颜色,用户可以选择“修改”|“页面属性”命令,打开“页面属性”对话框,在“分类”列表框中选择“外观”和“链接”选项,分别进行设置。
3.2.5 选择文档中的元素 如果用户要在Dreamweaver的文档中选择某个元素,只要在文档窗口的设计视图中选择文档元素时,单击该元素即可,如果元素不可见,在选择它之前必须使其可见。 • 选择可见元素 • 认识不可见元素 • 显示不可见元素
要在Dreamweaver 8的文档窗口中选择可见元素,有以下3种方法。 • 在文档窗口中单击要选择的元素,这是最常用的选择操作,在设计网页时会经常用到。 • 单击文档窗口底部标记选择器上的标记。 • 对于比较熟悉HTML标记的用户,直接通过选择相应的HTML标记来选择相应的元素。
要显示文档中的不可见元素,可以选择“编辑”|“参数选择”命令,打开“首选参数”对话框,并在“分类”列表框中选择“不可见元素”选项,然后在对话框右侧的“显示”选项区域中即可设置显示在文档中不可见元素。要显示文档中的不可见元素,可以选择“编辑”|“参数选择”命令,打开“首选参数”对话框,并在“分类”列表框中选择“不可见元素”选项,然后在对话框右侧的“显示”选项区域中即可设置显示在文档中不可见元素。
3.2.6 使用可视化向导设计网页 Dreamweaver中提供了“标尺”、“网格”和“跟踪图像”3种可视化向导供设计者使用,用户可以使用它们帮助设计网页和估计网页在浏览器中的外观。 • 使用“标尺”和“网络” • 使用“跟踪图像”
用户可以选择“查看”|“标尺”|“显示”命令,在网页文档中显示标尺。选择“查看”|“网络”|“显示网络”命令,在网页文档中显示网格。用户可以选择“查看”|“标尺”|“显示”命令,在网页文档中显示标尺。选择“查看”|“网络”|“显示网络”命令,在网页文档中显示网格。
要使用“跟踪图像”功能.可以选择“查看”|“跟踪图像”|“载入”命令,在打开的“选择图像源文件”对话框中选择合适的图片后,单击“确定”按钮即可。要使用“跟踪图像”功能.可以选择“查看”|“跟踪图像”|“载入”命令,在打开的“选择图像源文件”对话框中选择合适的图片后,单击“确定”按钮即可。
3.2.6 查看和编辑头部内容 • HEML文件由<head>和</head>标记之间的头部和<body>和</body>标记之间的正文部分组成。其中,正文部分(包括可见文本、图形等内容)是文档的主要部分。头部包含如文档类型、语言编码、JavaScript和VBScript函数和变量、关键字和搜索引擎指示器、样式定义等许多重要的信息。 • 另外,头部除了文档Title外都是不可见的,要查看这些头部内容,用户可以使用“查看”菜单,或文档窗口的代码视图。 • 显示文档 • 在文档头部插入元素 • 设置头部元素
3.3 上机实验 本章的上机实验主要练习在Dreamweaver 8中使用“导入”功能创建网页文档,并设置文档头部元素。其中,对头部内容的编辑是重点,用户在创建网页文档后,应根据需要适当对其进行编辑。在修改头部内容时应注意各个对话框选项的功能。对于本章中的其他内容,可根据理论指导部分进行练习。