第二章节 Dreamweaver基础.pptVIP

第2章 Dreamweaver基础 第2章 Dreamweaver基础 Dreamweaver是Macromedia公司出品的一款集网页制作和网站管理于一体的“所见即所得”的网页制作软件。无论用户愿意享受手工编写HTML代码时的驾驭感还是偏爱在可视化编辑环境中工作，Dreamweaver都提供了有用的工具，使用户拥有更加完美的Web创作体验。目前，Dreamweaver的最高版本为Dreamweaver 8。本章主要介绍Dreamweaver 8的基础知识、操作界面和站点管理功能。 2.1 Dreamweaver简介 作为网页制作软件，Dreamweaver提供了功能强大的可视化设计工具和精简而高效的代码编辑环境，使开发人员能够快捷地创建规范的Web应用程序，构建功能强大的网络服务体系。Dreamweaver的主要特点及功能如下。 ① 将“设计”和“代码”编辑器合二为一。Dreamweaver把编辑状态分为两种，一种是HTML源代码编辑状态，另一种是可视化编辑状态，这两种状态可以放在同一个窗口中，设计者可以在这个窗口中以书写HTML代码的形式或者以可视化的形式设计Web页，提高了网页设 2.1 Dreamweaver简介 计的效率。 ② 使用内置的图形编辑程序节省开发时间。借助内嵌的Fireworks技术，对图像的裁剪、缩放等编辑操作可以在Dreamweaver环境中直接完成。 ③ 提供操作方便、功能强大的用户界面。如，在设计视图中，开发者可以直接使用动态数据窗口去预览实时数据。 ④ 提供完美的CSS支持，可利用丰富的CSS样式表构建复杂、规范的站点。 ⑤ 提供完整的集成开发环境，可以开发HTML、XHTML、XML、ASP、Microsoft ASP.NET、 JSP、 2.1 Dreamweaver简介 PHP、和Macromedia ColdFusion站点，还可以通过插件定制和扩展开发环境。 ⑥ 可与一些常见格式的外部文档/代码实现无缝结合。比如，可以将Word和Excel等文档直接导入到Dreamweaver中。 ⑦ 提供了较多的行为，用户不用书写代码即可设计出功能丰富的网页。 ⑧ 通过布局视图技术将表格和层这两种排版工具结合起来，从而提供精确而且灵活的页面排版功能。 ⑨ 强大的网站管理功能。Dreamweaver的文件面板将整个网站的内容集中起来，可以预览和管理所有的 2.1 Dreamweaver简介 图形、颜色、外部URL、脚本、Flash、CSS等资源 。网站报告功能可以检查出网页中的常见错误，并提供快速修正的操作面板。 ⑩ 提供了跨浏览器兼容性检查功能，在保存时自动检查文档的跨浏览器兼容性，以检验页面中是否包含目标浏览器不支持的标记或CSS结构。 Dreamweaver易学、易用，只要掌握了其基本操作方法，即使初学者也能制作出具有专业水平的网页。 2.2 Dreamweaver 8的工作界面 2.2.1选择工作区布局 如果Dreamweaver安装在Windows系列的操作系统中，则初次启动Dreamweaver后，会弹出“工作区设置”对话框，对话框中提供了“设计器”和“编码器”两种布局风格，使用者可以根据自己的操作习惯，从中选择一种工作区布局。 “设计器”布局是一个使用MDI(多文档界面)的集成工作区，其中全部文档窗口和面板被集成在一个较大的应用程序窗口中，并将面板组停靠在右侧。习惯可视化编程的人员可使用此布局。考虑到大多数用户会选用这种布局风格，本书以此布局来介绍后续内容。 2.2 Dreamweaver 8的工作界面 “编码器”布局同样是集成的工作区，但是将面板组停靠在左侧，文档窗口在默认情况下显示为“代码”视图，习惯手工编码的人员可以使用这种布局。 Dreamweaver 8还提供了“双重屏幕”工作区布局。图2.1 起始页对话框 当选择一种工作区布局后，如果想切换成另一种工作区布局，可以选择【窗口】|【工作区布局】，然后在弹出的子菜单中选择工作区布局。 选择工作区布局后，Dreamweaver 8的工作界面会随之确定。 2.2 Dreamweaver 8的工作界面 2.2.2起始页 Dreamweaver 8在启动时，默认显示“起始页”对话框(图2.1)，用户可以在这个对话框中创建文档或打开最近使用过的文档，还可以通过产品介绍或教程了解关于Dreamweaver的更多信息。如果选中“不再显示此对话框”选项，则以后启动Dreamweaver时将不再自动显示起始页。 2.2.3 工作区布局 当新建或打开一个Web页后，Dreamweaver显示的工作区窗口如图2.2所示。窗口由主菜单、工具栏、文档窗口、面板组、属性面板等组成。 2.2 Dreamweaver 8的工作