网页设计工具Dreamweaverppt课件

网页设计工具Dreamweaver陈丽珊,网页设计工具Dreamweaver,3.1MacromediaDreamweaver4的工作环境3.2文档的基本操作,3.1MacromediaDreamweaver4的工作环境,3.1.1启动Dreamweaver43.1.2认识Dreamweaver4的窗口结构3.1.3控制浮动面板,返回首页,3.1.1启动Dreamweaver4,启动Dreamweaver4有两种常用方法：（1）打开“开始”菜单，选择“程序”，选择“MacromediaDreamweaver4”，再选择“Dreamweaver4”命令即可启动Dreamweaver4。（2）在Windows的窗口或资源管理器中直接启动Dreamweaver4并载入要编辑的HTML文档，首先选中要编辑的HTML文件图标，单击鼠标右键，选择“EditwithDreamweaver”命令，即可启动Dreamweaver4，并载入要编辑的HTML文档。启动后如图3-1所示。,图3-1Dreamweaver4的窗口结构,返回本节,3.1.2认识Dreamweaver4的窗口结构,Dreamweaver应用程序操作环境包括：1工具条2文档窗口3启动栏4对象面板5属性面板6可停靠浮动面板7标题栏8菜单栏9状态行,返回本节,3.1.3控制浮动面板,1使用启动面板单击启动面板上的“CSSStyles”（CSS样式）按钮，即会将可停靠浮动面板上的CSSStyles选项卡激活到顶端。,图3-2启动面板和微型启动栏的对应关系,图3-3使用启动面板,2使用对象面板,图3-4在对象面板上选择对象类型,3使用属性面板,图3-5选中文本时的属性面板,图3-6选中图像时的属性面板,4浮动面板的移动和重设大小通过拖动浮动面板的标题栏，就可以将浮动面板在桌面上移动，浮动面板的位置并不局限于Dreamweaver的文档窗口内，实际上，它可以移动到Windows桌面上的任何位置。除了启动面板和属性面板，其他大多数的浮动面板，包括对象面板和可停靠浮动面板，其大小都可以任意调整，通过拖动浮动面板的边框，就可以改变其大小。,5停靠浮动面板,图3-7带有多个选项卡的可停靠浮动面板,图3-8Dreamweaver4的窗口菜单,6状态行,图3-9状态行,在Dreamweaver4文档窗口的状态行上一些功能设置（如图3-103-14所示）：标记选择器窗口大小弹出菜单窗口大小弹出菜单文档大小和下载速度微型启动栏设置状态条属性标尺和网格设置中文环境查找帮助信息,图3-10窗口大小弹出菜单,图3-11参数选择对话框,图3-12设置字体和编码方式,图3-13Dreamweaver4的“帮助”菜单,图3-14Dreamweaver4的帮助系统,返回本节,3.2文档的基本操作,3.2.1文档的创建和存储3.2.2理解空白文档的初始代码3.2.3添加文本和插入对象3.2.4使用历史面板3.2.5编辑网页的头部内容,返回首页,3.2.1文档的创建和存储,1创建空白文档打开“文件”菜单，选择“新建”命令。2打开现有文档在Windows的资源管理器打开文档的图标，选择“用Dreamweaver编辑”命令；在Dreamweaver已经启动的情况下，打开“文件”菜单，选择“打开”命令；打开“文件”菜单，选择“导入”，再选择“导入WordHTML”命令来打开该文档。,3基于模板创建文档选择需要使用的模板，单击“选择”按钮，即可基于模板创建新文档。4存储文档保存文档的方法与一般Windows应用程序差别不大，这里无需多言。5关闭文档打开“文件”菜单，选择“关闭”命令。,返回本节,3.2.2理解空白文档的初始代码,1和：是HTML文档的开始和结束标记，HTML文档中所有的内容都应该在这两个标记之间，一个HTML文档总是以开始，以结束的。2和：位于文档的头部，用于包含当前文档的有关信息。3和：位于HTML文档的头部，也即位于和标记之间。4和：用于定义HTML文档的正文部分，通常它在标记之后，而在标记之前。,返回本节,3.2.3添加文本和插入对象,1添加文本可以直接在文档窗口中键入文本。2插入对象打开“插入”菜单，选择要插入对象的菜单项命令或显示对象面板，找到要插入对象对应的按钮。单击（拖动按钮）即可在插入点所在位置插入对象。,3插入日期,图3-15插入日期对话框,4插入特殊字符,表2-1常见的字符及其参考,图3-16对象面板上的特殊字符按钮,5插入水平线插入和编辑水平线理解水平线标记,图3-17水平线的属性面板,6在文档窗口中选择元素不可见元素定制不可见元素的显示显示不可见元素显示头部元素,图3-18设置不可见元素的显示方式,7设置文档的页面属性打开“修改”菜单，选择“页面属性”,图3-19页面属性对话框,返回本节,3.2.4使用历史面板,图3-20历史面板,返回本节,3.2.5编辑网页的头部内容,1插入头部内容,图3-21对象面板上的头部元素按钮,2认识头部元素元数据（metadata）：是HTML头部的主要组成部分，主要用于表示一个文档的页面信息，这些信息可以被计算机识别，用于某些特定的场合。标记：是实现元数据的主要标记。标记：定义了文档的基础URL地址，参见表2-2。标记：定义了文档之间的包含。在HTML的头部可以包含任意数量的标记。,表2-2target的属性值,3插入元数据,图3-22插入元数据,4插入关键字,图3-23插入关键字,5插入描述信息单击对象面板上的“插入描述”按钮。这时会出现一个对话框，提示输入描述信息，该对话框同图3-2