电子商务网站建设与维护第四章.pptVIP

目录 目录 2 第二节 Dreamweaver CS4简介 3 1 第一节 网页制作工具简介 第三节 Dreamweaver CS4基本操作 4 第四节 网页制作实例 1.了解主要的网页制作工具； 2.了解Dreamweaver CS4的界面组成及其主要功能。 会使用Dreamweaver CS4进行网页制作。 一、标签型网页制作工具 二、“所见即所得型”网页制作工具 一、Dreamweaver CS4的新增功能 实时视图 代码提示 相关文件 代码导航器 集成编码 新增功能 二、Dreamweaver CS4的工作界面 二、Dreamweaver CS4的工作界面 主要包括“文件”、“编辑”、“查看”、“插入”、“修改”、“格式”、“命令”、“站点”、“窗口”、“帮助”等菜单。在制作网页的过程中，要实现某种功能，只需单击菜单栏中的菜单，在弹出的下拉菜单中选择要执行的操作即可。例如，要修改页面属性，则只需单击菜单栏中“修改”菜单，从下拉菜单中选择“页面属性”命令，在打开的“页面属性”对话框中设置即可。 包含一些按钮，用于在文档的不同视图间快速切换，还包含一些与查看文档、在本地和远程站点间传输文档有关的命令和选项。 菜单栏 文档工具栏 二、Dreamweaver CS4的工作界面 文档编辑区中的内容构成网页的主体。通过相关的工具或命令所实现的网页效果将在文档编辑区中显示。 提供与用户正在创建的文档有关的其他信息。其中“标签选择器”显示环绕当前选定内容的标签的层次结构。单击该层次结构中的任何标签可以选择该标签及其全部内容。“窗口大小”下拉列表框用来将文档窗口的大小调整到预定义或自定义的尺寸。状态栏右侧分别显示当前页面的文档大小、估计下载时间及当前文档的编码方式。 文档编辑区 状态栏 二、Dreamweaver CS4的工作界面 用于检查和编辑当前选定页面元素（如文本和插入的对象）的最常用属性。属性面板中的内容根据选定元素的不同会有所不同。 属性面板 二、Dreamweaver CS4的工作界面 Dreamweaver CS4将各种工具面板集成到面板组中，用户可以根据自己的需要在菜单栏的“窗口”列表中选择隐藏和显示面板。 面板组 （一）创建站点 打开站点向导。 1 2 3 在“您打算为您的站点起什么名字？”文本框中输入网站的名称。 单击“下一步”按钮，弹出选择服务器技术对话框。在该对话框中可以设置网站需要用到的服务器技术。 利用站点向导创建站点的操作步骤 （一）创建站点 单击“下一步”按钮，设置站点的编辑方式和文件的存储位置。 4 5 6 单击“下一步”按钮，打开设置远程站点对话框。在“您如何连接到远程服务器？”下拉列表框中可以选择连接到服务器的方式。 单击“下一步”按钮，向导显示站点设置的概要，表示站点建立已经完成，单击“完成”按钮，完成设置。 （二）建立主页 执行“文件”→“新建”命令，打开“新建文档”对话框，单击“空白页”选项，在“页面类型”列表框中单击HTML选项，再单击“创建”按钮，即可创建一个HTML静态网页。 1 2 （2） 执行“文件”→“另存为”命令，Dreamweaver CS4会默认把文件保存路径指向刚才建立的站点文件夹内，这可以方便设计者管理。为主页文件命名，单击“保存”按钮，一个网站的首页就创建好了。 创建好首页后，可在其中添加文字、图片等页面元素，以丰富页面的内容。 （三）添加文字和图片 直接插入法 复制粘贴法 导入文档法 如导入已有的一篇Word文档，在文档窗口中，将光标定位到要导入文本的位置，执行“文件”→“导入”→“Word文档”命令，打开“导入Word文档”对话框，在其中选择要导入的Word文档，单击“打开”按钮，即可导入文本。 在打开的Dreamweaver CS4文档中，将光标定位到需要输入文本的地方，直接通过键盘输入即可。 将文本文档中的文字直接复制到Dreamweaver CS4文档中需要添加文字内容的光标所在处 （四）创建超链接 1.绝对路径链接 绝对路径链接适用于创建外部链接，要求提供所链接文档的完整URL，而且包括所使用的协议，如/。 2.文档相对路径链接 文档相对路径链接和站点根目录相对路径链接实际都是站点内部链接，但文档相对路径链接更加简单易用。创建相对路径链接要求链接的两个文档必须在同一个站点下保存。 （五）添加多媒体元素 1. 在网页中插入Flash动画和FlashPaper文档 （1） 插入Flash动画。打开要插入Flash动画的文档，将光标定位到要插入Flash动画的位置，在“插入”面板的“常用”类别中单击“媒体”下拉按