第2章 网页设计——初识Dreamweaver.ppt

第2章 初识Dreamweaver 8 熟悉Dreamweaver 8操作环境 网站规划与管理 设置页面属性 上机实践——编辑“墨攻”页面并保存 2.1 熟悉Dreamweaver操作环境 安装Dreamweaver 8后，单击“开始”按钮，选择“所有程序”“Macromedia”“Macromedia Dreamweaver 8”菜单，就可以启动Dreamweaver 8了。进入Dreamweaver 8后，首先映入眼帘的是起始页。 在起始页的“创建新项目”列中选择“HTML”后，将会进入Dreamweaver 8的工作界面。 2.1.1 “插入”栏 “插入”栏包含用于将各种类型的对象（如图像、表格和层）插入到文档中的按钮。 单击“插入”栏左侧的“常用”按钮可以打开一个下拉列表，从中选择其他选项可以改变“插入”栏的内容。 2.1.2 文档标签与文档工具栏 文档标签显示了当前打开的网页文档的名称。 2.1.3 文档窗口中的状态栏 状态栏位于文档窗口底部，它提供了与当前文档相关的一些信息。 2.1.4 属性面板与面板组 属性面板用于查看或编辑所选对象的属性。属性面板会随着所选对象的不同而变化。 Dreamweaver 8为用户提供了众多面板，如属性面板、文件面板、历史记录面板等。为便于管理，Dreamweaver 8将这些面板归入到不同的面板组中。 2.2 网站规划、创建与管理 2.2.1 确定网站结构 2.2.2 确定站点目录结构 确定好网站结构后，接下来应根据网站结构创建本地站点，实际上就是确定本地站点以及文件的存放位置。 2.2.3 定义站点 2.2.4 新建、打开和关闭网页文件 1.新建网页文件 2.打开网页文件 如果要打开某站点中现有的网页文件，可以选择“文件”“打开”菜单，在“打开”对话框中进行选择。 3.关闭网页文件 要关闭网页文件，只需单击相应文件右上角的“关闭”按钮　，或者按【Ctrl+W】组合键。 2.2.5 保存和预览网页文件 新建或编辑网页文件后，需要保存文件，才能使所做的设置生效。选择“文件”“保存”菜单或按【Ctrl+S】组合键，即可保存文件。 2.2.6 “文件”面板的应用 在Dreamweaver中，利用“文件”面板可以非常方便地管理站点中的网页文件和文件夹。 1．新建文件和文件夹 利用“文件”面板可以方便地新建文件（实际上就是网页）和文件夹。 2．重命名文件和文件夹 在“文件”面板中可以方便地重命名文件和文件夹，在右键快捷菜单中选择“编辑”“重命名”菜单即可。 3．文件与文件夹的命名规则 为便于日后的维护和管理，网站中所有文件和文件夹的命名都是有一定规则的。 4．在“文件”面板中打开和删除文件 要打开文件，可以直接在文件列表区双击文件名。如果是网页文件，该文件会自动在网页编辑区打开；如果是图像文件，系统会自动启动Fireworks并打开文件。 要删除文件或文件夹，可以右击文件或文件夹，然后在弹出的菜单中选择“编辑”“删除”，也可在选中文件后，直接按【Delete】键删除。 2.3 设置页面属性 2.3.1 外观选项 2.3.2 链接选项 在“页面属性”对话框中，单击左侧“分类”列表中的“链接”选项，其参数设置将显示在对话框右侧。 2.3.3 标题选项 单击左侧“分类”列表中的“标题”选项，其参数设置将显示在对话框右侧。 2.3.4 标题/编码选项 单击左侧“分类”列表中的“标题/编码”选项，其参数设置将显示在对话框右侧。 2.3.5 跟踪图像选项 单击左侧“分类”列表中的“跟踪图像”选项，其参数设置将显示在对话框右侧。 2.4 上机实践——编辑“墨攻”页面并保存 本节通过编辑 “墨攻”页面，来使读者进一步领略Dreamweaver的独特魅力 * * 打开最近打开过的文件 创建不同类型的新文件 在系统内置文件的基础上创建新文件 菜单栏 标题栏 插入栏 文档标签 文档工具栏 收缩与展开下方面板组 状态栏 属性面板 收缩与展开右方面板组 面板组 单击“常用”按钮，在下拉列表中选择“显示为制表符”命令，“插入”栏的外观将发生变化。 某些按钮的右侧带有一个小三角符号“ ”，单击该三角符号将弹出该按钮的一组同位按钮。 只显示代码视图 显示代码视图和设计视图 只显示设计视图 刷新设计视图 在浏览器中预览/调试 文档工具栏用于切换网页视图，管理文件，以及预览网页等。 文档标题 标签选择器 手形工具 缩放工具 文档大小与预计下载时间 标签选择器显示了光标所在位置的标签的层次结构。 选取、手形和缩放工具是Dreamweaver 8新增的功能， 分别用于选取、移动和缩放对象。 选取工具 选中图像后的属性面板 选中文字后的属性面板 “文件”面板组包括三个面