网页设计与制作02.pptVIP

第2章 网页制作基础 本章要点： u中文Dreamweaver MX 2004的工作窗口 u中文Dreamweaver MX 2004的工具栏 u中文Dreamweaver MX 2004的文档窗口 u中文Dreamweaver MX 2004的浮动面板、 菜单和辅助设计工具 uHTML基础 uHTML的各种标记 2.1 中文Dreamweaver MX2004的工作窗口2.1.1 工作窗口 ·插入栏：包含用于将各种类型的对象插入到文档中的工具按钮。例如，图像、表格、层、框架等。 ·菜单栏：菜单栏中的每一项均有一个下拉菜单，Dreamweaver MX 2004中的大部分操作均可通过下拉菜单实现。 ·文件面板：用于创建站点、管理组成站点的文件和文件夹 。 ·面板组：包含一些打开和关闭常用面板和检查器的按钮。 ·属性检查器：用于查看和更改所选对象或文本的各种属性。每种对象都具有不同的属性。 ·标题栏：显示当前正在编辑的网页名称与文件名 。 2.1.2 文档窗口 1. 标题栏 显示当前网页页面的标题及打开的文件名。 2. 工具栏 文档工具栏包含可在代码视图、设计视图之间快速切换的按钮，并包含一些与选定视图有关的常用命令。 ·“代码”按钮：在文档中显示代码视图。可以直接查看和编辑HTML源代码。 ·“拆分”按钮：同时显示代码视图与设计视图。代码视图显示在上方，设计视图显示在下方。 ·“设计”按钮：在文档中显示设计视图。设计视图是默认方式，可以达到所见即所得的效果。 ·“标题”文本框：显示或编辑当前网页的标题。 ·“在浏览器中预览/调试”按钮：在浏览器中预览网页效果或检查错误。 ·“文件管理”按钮：查看文件的上传、下载等状态。 ·“刷新设计视图”按钮：刷新设计视图。 ·“视图选项”按钮：为不同的视图设置选项。 3. 页面编辑区 用于设置和编辑页面内的文本、图形和表格等。 4. 状态栏 用于选择标记、设置窗口大小以及调整文件的下载速度。 ·标签选择：显示当前插入点的HTML源代码标签，在标签上单击鼠标右键可控制HTML代码，单击body可选择整个文档的正文部分。 ·文件大小以及下载速度：显示当前网页的文件大小以及下载速度。 ·窗口大小：在窗口大小区域单击鼠标，可设置当前编辑窗口的大小。 5．标准工具栏：在“查看”菜单中选择“工具栏”、“标准”选项，可以打开或关闭标准工具栏。 2.1.3 浮动面板 所有浮动面板都可以由“窗口”菜单控制显示或隐藏，部分常用浮动面板还可通过启动器来显示或隐藏。 1、插入面板 使用“窗口”菜单的“插入”选项或按快捷键Ctrl+F2可显示或隐藏插入面板。 2、属性面板 使用“窗口”菜单的“属性”选项或按快捷键Ctrl+F3，可显示或隐藏属性面板。 属性面板中的项目是随着网页中选定对象的不同而改变的。在属性面板中，详细地列出了所选对象的属性参数，用户可以通过属性面板查看或修改这些参数。 3、面板组 使用“窗口”菜单中的选项，可以显示或隐藏各种面板。 （1）资源面板 资源面板中列出了当前网页或站点中用到的各种网页元素 。 资源面板中的工具按钮从上到下依次是：图像、颜色、URLs(超级链接)、Flash动画、Shockwave、影片、脚本、模板、库。 （2）行为面板 行为面板是编辑网页中由特定事件触发交互行为的地方，能为网页添加很多特殊效果。 （3）CSS样式面板 可以方便地定义CSS样式和管理CSS样式。 （4）代码检查器 列出了当前网页文件的HTML源代码，对不同的HTML源代码将用不同的颜色显示，并用黄色高亮显示错误代码。 （5）框架面板 框架面板以一种在文档窗口中不能显示的方式显示框架集的层次结构 。 （6）层面板 列出了当前网页中的层对象列表和叠放优先顺序：先建立的层位于列表的底部，最后建立的层位于列表的上部。使用层面板可以防止层重叠，改变层的可见性和叠放顺序。 （7）历史记录面板 历史记录面板自动记录了用户最近进行的50步操作。可以通过历史记录面板撤消已完成的操作 。 （8）参考面板 通过参考面板，用户可以快速地获得JavaScript、HTML、CSS和BrowserDOMs等的参考信息。 2.2 使用面板、菜单和辅助设计工具 2.2.1 显示和隐藏面板 使用“窗口”菜单，可以显示和隐藏各个面板。当面板选项前具有“?”标志时，表示该面板已经显示，单击该选项则关闭显示。 2.2.2