第2章Dreamweavercs5基本操作要点.pptVIP

* * 第2章 Dreamweaver CS5的基本操作 * * 主要内容 2.1 初识Dreamweaver CS5 1 2.2 认识Dreamweaver CS5工作界面 2 2.3 自定义工作环境 3 * * 2.4 站点的创建与编辑 4 2.5 管理站点中的文件或文件夹 5 主要内容 2.7 综合案例——创建一个小型公司站点 7 2.6 设置页面属性 6 2.1 初识Dreamweaver CS5 Dreamweaver是个原本由Macromedia公司所开发的著名网站开发工具，是一款所见即所得的可视化网页编辑软件。它的出现使网页的创作变得非常轻松，并且与Fireworks和Flash一起被人们称为“网页三剑客”。到目前为止，它是最受欢迎的网页制作软件之一。 随着Internet的迅速发展，网页设计软件也在不断更新。Dreamweaver CS5作为升级版本，是Adobe公司最新推出的CS5系列套件中的网页制作软件，新增了许多新功能与特性；增强了软件的可操作性，优化了部分工具和菜单，有利于用户更加熟练地进行操作。 2.2 认识Dreamweaver CS5工作界面 2.2.1 菜单栏 Dreamweaver CS5的主菜单包括：【文件】、【编辑】、【查看】、【插入】、【修改】、【格式】、【命令】、【站点】、【窗口】、【帮助】菜单。此外，在主菜单的右侧还增加了【布局】、【扩展】、【站点】和【设计器】4个按钮，如图2-2所示。 图2-2 菜单栏 2.2 认识Dreamweaver CS5工作界面 2.2.2 文档工具栏 文档工具栏包括了【代码】、【拆分】、【设计】、【实时代码】、【实时视图】等按钮和一些比较常用的弹出菜单，通过【代码】、【拆分】、【设计】、【实时代码】按钮可以实现文本在不同的视图模式之间进行切换，如图2-3示 图2-3 文档工具栏 2.2 认识Dreamweaver CS5工作界面 2.2.3 状态栏 文档窗口底部的状态栏提供了用户正在创建的文档的有关信息，如图2-5所示。 图2-5 状态栏 2.2 认识Dreamweaver CS5工作界面 2.2.4 “属性”面板 “属性”面板是非常重要的面板，主要用于查看和更改所选对象的各种属性，所选的对象不同，显示的属性也将不同。通常情况下，“属性”面板位于文档窗口的底部，可以通过双击“属性”使该面板显示或者隐藏，还可以通过单击并拖动的方法移动该面板到文档窗口的其他位置，如图2-6所示。 图2-6 “属性”面板 2.2 认识Dreamweaver CS5工作界面 2.2.5 浮动面板 1．“CSS样式”面板 2．“插入”面板 图2-7 “CSS样式”面板 图2-8 “插入”面板 2.3 自定义工作环境 1．工作区调整与管理 （1）选择、调整工作区布局 （2）新建工作区布局 （3）管理工作区布局 2.3 自定义工作环境 2．工具栏和面板操作 （1）在【查看】【工具栏】菜单中选择要显示/隐藏的工具栏名称，或者右击工具栏，从弹出的快捷菜单中选择相应的工具栏名称。 （2）选择【窗口】菜单栏中的面板名称，用来显示/隐藏某个面板。 （3）双击左上角面板组的名称，就可以展开/折叠面板组。 2.3 自定义工作环境 3．编辑首选参数 选择【编辑】【首选参数】命令，打开“首选参数”对话框，在“分类”列表框下选择相应的项目，设置其属性，如图2-10所示 图2-9 管理工作区 图2-10 首选参数设置页面 2.4 站点的创建与编辑 2.4.1 创建站点 1．快速创建本地站点 图2-11 执行“新建站点”命令 图2-12 “站点设置对象 我的站点”对话框（一） 2.4 站点的创建与编辑 图2-13 “文件”面板中的新站点 2.4 站点的创建与编辑 2．远程站点参数设置 （1）设置服务器 （2）版本控制 （3）高级设置 2.4 站点的创建与编辑 2.4.2 管理站点 1．打开站点 2．编辑站点 3．删除站点 4．复制站点 5．导出和导入站点 2.5 管理站点中的文件或文件夹 2.5.1 新建文件或文件夹 网站中的文件被统一存放在单独的文件夹内，根据文件的多少，又可以细分到子文件夹里。 图2-25 新建文件夹 图2-26 文件夹重命名