1、Dreamweaver 完全教程新特性快速了解一、新特性概览Dreamweaver 是 WEB 站点开发的中心环节。完全用户自定义控制可以迅速完成页面以及站点的设计。Roundtrip HTML/Javascript 行为库以及可视化编辑环境大量减少了代码的编写，同时亦保证了其专业性和兼容性。通过 Dreamweaver 与其它群组产品的配合使用以及众多第三方支持可轻松完成动态发布个电子商务网站的构建。到目前为止，全世界范围超过 60% 的专业网页设计师都在使用 Dreamweaver下面就让我们来看看 4.0 版都具有哪些新的功能 代码显示编辑代码变得前所未有的简单。可以通过新的综合性的文本
2、编辑器来查看代码，或用新的分离显示来同时观察代码 和设计。新的代码显示会区分语法的颜色，标签的对称，以及自动缩进代码JavaScript 调试器JavaScript 的客户端调试直接在你的浏览器里。新的 JavaScript 调试器让你可以看到 Javascript 在Navigator 或者 Internet Explorer 里的执行情况，帮助你理解每个浏览器如何执行 Javascript。你可以通过设置断点和观察代码中传递更新的数值来挑是你的代码排版显示便捷的设计合成页面。唯一的新的排版显示，可以让你运用常见的排版技巧，就好像直接在页面上画画，拖动单元格，或者组合单元格来建立嵌套的表格。
3、假如你正在已存在的表格上工作，或建立新的版面，排版显示总是会在所 有的浏览器里建立干净的表格Macromedia Flash 按钮和文本可在 Dreamweaver 里直接建立可编辑的矢量图形。新的 Macromedia Flash 按钮和 Macromedia Flash 文本特性让你可以和 Macromedia Flash 设计师一同工作，你可以创建新的按钮风格或下载免费的按钮风格从 Macromedia 的服务 器上。素材库面板追踪中心区域里所有的媒体。用新的资产面板来预览和管理图片，颜色，连接的 URL，脚本，Macromedia Flash 内容, Shockwave 内容，Quic
4、kTime 内容, 临时文件，和库条目。返回图形编辑加快了在 Dreanweaver 和 Fireworks 之间的图像和 HTML 编辑速度。返回图形编辑让你可以启动并编辑并且启动并优 化图像。通过扩展程序来快速的添加图形索引，按钮或将整个相册加入你的站点。Microsoft Visual SourceSafe 和 WebDav 综合为了版本的控制，将 Dreamweaver 和 Micorsoft Visual SourceSafe 合成起来。同时也用包括 Interwoven、Vingnette、BroadVision、ATG 和 Documentum 在内的 WebDAV 协议，将其与
5、先进的内容管理系统结合起来。所有的这些 业内领先企业都选择 Dreamweaver Platform 作为他们内容管理系统的 HTML 前台。站点报告通过站点报告来快速的发现和解决错误。运行报告来找出在你站点里共同的问题或者写出一个标准的报告在连接站点里的问题。Macromedia 对于 Dreamweaver 的服务下载强大的扩展。Macromedia Exchange for Dreamweaver 是一个提供 Macromedia Flash和 Fireworks 扩展程序集中区域搜索引擎。你可以通过 exchange 和你的团队共享对象，行为脚本和指令。二、新功能使用说明根据 Macr
6、omedia 公司官方网站报导新的 Dreamweaver4 增加了很多新的功能 Dreamweaver3 原有的一些功能也大大增强了。下面从代码编写相关功能设计相关功能和协作相关功能三个方面介绍 Dreamweaver4 的新特色。一代码编写相关功能1.往返 HTMLDreamweaver4 独特的往返 HTML 功能使我们可以同步访问设计视图（DesignView）和 HTML 源代码。可以打开用其它编辑器编辑的文档但它不会改写你手工输入的 HTML 标记或第三方标记。这就使得Dreamweaver 自动生成的代码与手工输入的代码融为一体各自“ 相安无事”。*2.整合文本编辑器现在 Dre
7、amweaver4 增加了以代码为中心的新特性手工编写代码就像在设计视图环境一样方便可以自动缩排标点平衡选择多行后一次缩进。可以在使用代码视图工具栏（CodeViewToolbar ）的下拉列表定义的 JavaScript 函数之间轻松导航。对于使用 JavaScript 编程的专业人员这种代码导航无疑是一种高效的导航帮助。输入代码时 Dreamweaver 自动对 HTML 和 JavaScript 代码使用不同的颜色显示。*3.把主窗口分割为代码视图和设计试图可以把 Dreamweaver 的主窗口分割为代码视图和设计试图让你能够查看整页代码而无需离开文档窗口。这样就可以在同一个窗口同时查
8、看代码视图和设计试图或同时编辑多个文档的代码。*4.JavaScript 调试器使用新增的 JavaScript 调试器可以直接在浏览器中调试客户端 JavaScript 脚本观察 JavaScript 的执行就像它在 Netscape 或 IE 浏览器中一样因而能够更好地了解每种浏览器是怎样执行 JavaScript 的。可以设置断点调试代码然后在逐步执行代码的过程中观察变量的变化.及时发现编程错误。*5.集成 O“Reilly 代码参考Dreamweaver4 集成了 O“Reilly 出版物中关于代码参考方面的内容，可以快速获取关于 JavaScript 的信息，包括浏览器文档对象模型(
9、DOMs)、CSS。6.集成 BBEdit6.0 和 HomeSite4.5Dreamweaver4 集成了 BBEdit6.0 评测版和 HomeSite4.5。使用这些领先的文本编辑工具可以大大增强Dreamweaver 的文本编辑功能，提高编码工作效率。7.快速标记编辑器快速标记编辑器让你在设计视图中手工编写代码更加快捷。可以快速修改、添加、删除页面中选定对象的 HTML 标记。*8.编辑非 HTML 文档可以把 Dreamweaver 当作文本编辑器编辑非 HTML 文档直接在代码试图(CodeView) 中编辑JavaScriptXML 和其它文本文件。9.自定义标记数据库使用自定义
10、标记数据库可随时定义新的标记或编辑默认标记。Dreamweaver 的可配置自定义数据库让你能够定制翻译引擎来支持属性代码。10.支持 W3C 标准Dreamweaver 提供对 W3C 标准的很好支持包括 HTML 和 CSS。注：序号前有*的为 Dreamweaver4 新增功能其余为增强功能 二设计相关功能*1.布局视图使用新增的布局视图（LayoutView）很容易设计复杂的页面。可以在页面直接绘制单元格然后指定当页面大小改变时布局怎样变化。表格单元可以随意拖动也可以把表格单元组合在一起构成嵌套表格。不管是使用现有表格布局或是创建新的布局布局视图总能够创建与所有浏览器兼容的乾净表格。强
11、大的可视化设计特性包括拖放表格图像和层。标准视图（StandardView）为编辑页面提供了丰富的所见所得（WYSIWYG）编辑环境。 *2.Flash 文本和按钮使用 Dreamweaver4 中新增的 Flash 按钮和 Flash 文本功能可以在 Dreamweaver 中直接创建可编辑的矢量图。使用 Flash 矢量图代替按钮和文本的位图图像可缩放文件更小打印效果更好。可以使用 Flash 设计工具创建新的按钮样式或从 Macromedia 的交流中心(MacromediaExchange) 下载免费的样式。3.历史面板通过历史面板可以记录每一步操作以便重复使用。也可以把这些操作步骤保
12、存为共享命令。历史面板使工作流程可视化可以快速撤消任何操作步骤甚至是已经保存的操作步骤。4.整合标记选择器使用整合的标记选择器可以很容易地选择文档中的 HTML 标记编辑标记或删除标记。5.CSS 和 HTML 样式Dreamweaver 支持 CSS 和 HTML 样式可以轻易对单元格行列和离散选择应用全局样式。6.描摹图在设计阶段在布局视图中采用草图描摹方法可以快速创建表格布局大大减少设计精确表格布局所的时间。7.梦幻模板使用梦幻模板允许内容提供者在 HTML 文档中直接编辑不会危及站点的设计。一个绑定的矩形和包含可编辑区名的标签有助于直观地识别模板的可编辑区。*8.往返图表编辑使用往返图
13、表编辑（RoundtripTableEditing）功能，可以在 Dreamweaver 中直接启动 Fireworks，编辑和优化图形，加速图形和 HTML 的编辑。可以在 Fireworks 中快速编辑切图，然后回到 Dreamweaver 页面中重新组合，无需重新设计原来的 HTML 表格和记忆切图名称。从 MacromediaExchange 下载即时图形扩展集（InstaGraphicsExtensionSet） ，可以立即在你的网站中添加图形小球、按钮或完整的网络影集。 9.支持多种媒体Dreamweaver 自身支持 Flash、Shockwave、Generator、Quick
14、Time 和 Real 媒体内容，让你能够在Dreamweaver 中集成和预览各种媒体内容。*10.Macromedia 标准用户界面新的用户界面与所有 Macromedia 的 Web 著作产品保持一致。所有应用程序将共享通用用户界面元素，包括面板的外观、菜单名称、键盘快捷键、图标、拾色器、窗口快照、启动栏和工具面板等。新的键盘快捷键更加灵活，便于使用。注：序号前有*的为 Dreamweaver4 新增功能，其余为增强功能。 三、协作相关功能*1.资源管理器使用新增资源面板（AssetPanel）可以在一个中心位置跟踪所有站点的媒体。可以预览和管理所有站点的图像、颜色、外部 URL、脚本、
15、Flash、Shockwave、QuickTime、模板和库元素。可以把常用资源保存到收藏夹，并可以跨站点使用这些资源。2.MicrosoftOffice 集成可以轻易集成 MicrosoftOffice 文件。CleanUpWordHTML（清理 WordHTML）命令删除MicrosoftWord 属性标记。表格对象（TableObject）让你能够在 Dreamweaver 中导入用逗号分隔的全尺寸图像数据文件。*3.SourceSafe 和 WebDAV 集成Dreamweaver4 中集成了领先的版本控制软件 MicrosoftVisualSourceSafe。这就使得大的开发团队可
16、以把 Dreamweaver 用作标准的 HTML 前端开发工具。此外，Dreamweaver 的站点管理窗口还与任何内容管理系统或支持 WebDAV 协议（W3C 的源控制标准）的 Web 服务器（如 WindowsIIS5 和 Apache）集成。*4.站点报告使用站点报告功能可以快速识别和修复错误。执行报告命令，查找站点中存在的常见问题（如缺少替换文本或文档无标题），或书写一个自定义的报告，在站点中查找指定的问题。5.设计笔记设计笔记有助于开发团队的高效协作。通过开设计笔记可以在一个地方跟踪每个源文件的注释和状态。*6.可配置站点管理窗口使用设计笔记命令可以在站点管理窗口添加自定义栏。这
17、个功能为开发团队跟踪站点开发提供了灵活简单的方式。7.站点地图使用站点地图与你的站点导航视图交互，进行快速的站点设计和重组。可以直接在站点地图中单击，串接新站点，创建新文件和新链接。8.同步站点使用同步站点命令（SynchronizeSite）可以保持本地站点与远程站点版本的同步，可以删除每个站点中的无用文件，因而能够在不追踪被修改文件的情况下轻松更新远程服务器。*9.集成 E-mail集成 E-mail 使开发团队成员之间的通讯更加快捷、方便。当一个文件被某人注销时，可以单击他的名字，给他发送 E-mail。在工作流（Workflow）标签下站点定义对话框中可以定义你自己的 E-mail 地
18、址。10.可配置菜单使用可编辑的 XML 文件，你可以完全定制整个 Dreamweaver 菜单系统。使用键盘快捷键管理器定制快捷键，创建新的快捷键，或载入以前配置的快捷键设置。*11.Macromedia 交流中心Macromedia 交流中心（MacromediaExchange）提供一个中心场所，在这里有很多易于安装使用的Dreamweaver 插件。通过这个中心，你可以从庞大的插件开发者社团成员的努力中获得好处，或与你的团队成员共享对象、行为和命令。只要轻轻一击，你就可以安装和管理 Dreamweaver 的各种插件。注：序号前有*的为 Dreamweaver4 新增功能，其余为增强功
19、能。完全功能列表一、设 计结构视图新的结构视图可以帮助你轻松的完成结构复杂的页面。在页面上直接画出表格单元，并可注释在页面大小改变时，结构应如何变化。只要简单的拖动单元格或将一组单元格汇拢，就可以建立嵌套式的表格。你是否正在忙于修改已建立的表格或正在创建新的结构呢？结构视图可以帮助你建立一个新的表格，并在任何浏览器中显示。这些强大的可视化设计特性还包括表格、图象和结构的拖放。标准的视图为页面编辑工作提供了一个“所见既所得”环境。 Macromedia Flash 文本和按钮随着 Macromedia Flash 按钮和 Macromedia Flash 文本这些特性的添加，在 Dreamwea
20、ver 中可以直接建立可编辑的矢量图。用 Macromeida Flash 矢量来取代位图制作按钮和文本，你的图象就可以升级、文件可以更小，而在打印效果就会更佳。让我们和 Macromedia Flash 的设计者们一起创作出新颖的按钮模式，你也可以到Macromedia Exchange 上下载免费的按钮模式。 历史记录为了方便再使用可以把每一个操作记录下来，也可以将每一个步骤的操作指令保存下来供将来共享。这个历史记录板让你看到了你的工作流程，也可以撤消任何一个操作，包括已经存盘的。完整的标签选择器用完整的标签选择器可以在文档上简单的选择HTML 标签、编辑标签或删除标签。CSS 和 HTM
21、L 模式在 Dreamweaver 中，简单的将单元格、行、列和分散的选择项作为全局模式。图象跟踪把在设计阶段制作的图象作为导向，在结构视图中快速建立基于表格的结构。这样可以大大减少了建立结构所需要的时间。梦想模板让制作者们不用考虑网站规划就直接在 HTML 中进行编辑。一个大小固定的矩形和标签就可以保存下编辑区域的名称，这样一来，就可以可视化的命名模板的编辑区域。往返的图象编辑用往返表格编辑在 Dreamweaver 和 Fireworks 之间来回的快速编辑图象和 HTML，这样就可以在Dreamweaver 中直接 “调用编辑”图象和“调用优化”图象。快速的在 Fireworks 中对切
22、割的图象作修改，在 Dreamweaver 页面中重新合成这些修改，而无需重新操作 HTML 表格或记住那些切割图象的名称。是否想立即为你的网站准备添加图象公告栏、按钮或全套的网页图片集呢？请从 Macromedia Exchange 上下载 Extension Set。为丰富的媒体内容准备的 Native Support为 Macromedia Flash、Shockwave、Generator、QuickTime 和 Real Content 所设计的 Native Support 可以让你在Dreamweaver 中合成和预览内容。Macromedia 用户界面体验一下 Macromed
23、ia 的用户界面，这是一个Macromedia 网页授权产品的新的标准界面。所有的产品将采用共同的用户界面内容，包括新的但仍是用户所熟悉的键盘快捷键，使之更为方便。共同的截面元素包括调色板的外观、菜单命名、键盘快捷键、按钮、颜色采摘、窗口样式、调用栏和工具板。二、Code 编码特性往返 HTML同时访问设计视图和 HTML 源代码。在Dreamweaver 中，你可以打开任何一个在别的编辑器中建立的文档，而不用担心它是手写或三类标签，也不用覆盖。完整的文本编辑器如今，手写编程已经可以象在设计视图中工作一样得心应手了，因为具备了诸如自动排版、符号权衡和选择多行并立即排版等编码核心特性。在编码视图
24、工具栏中使用一个竖直的表单就可在文档中定义 JavaScript 功能导航。编码导航，对那些操作 JavaScript 的专业用户来说是一个十分有效的导航工具。HTML 和 JavaScript 在你编写时是自动用颜色分类的。分窗编码和设计视图新的分窗环境让你可以可视化的工作，或者提供一个满页的编码试图而不用跳出文档窗口。在同一个窗口同时可以看到代码和设计图象，或者也可以在同时为多个文档编码。JavaScript 纠错器你可以在你的浏览器中为客户端的 JavaScript纠错。新的 JavaScript 纠错器让你犹如在 Netscape或 IE 中看 JavaScript 代码一样，让你更好
25、的了解每一个不同的浏览器是如何执行 JavaScript 的。设立断点来为你的代码纠错，然后在你浏览整个代码时检查你的变量。完整的 OReilly 代码指导在 JavaScript 上可以快速的得到指导信息，包括浏览器 DOM，HTML 和 CSS。这是由OReilly 推出的新的完整的代码指导特性。合成的 BBEdit 6.0 和 HomeSite 4.5 包在 HomeSite 4.5 中为 Dreamweaver 所提供的完整的支持，和 BBEdit 6.0 的复制版让你可以轻松的使用这些先进的文本编辑器和Dreamweaver。快速标签编辑器快速标签编辑器让那些手写编程人员可以在设计视
26、图中快速进行编辑。在一页上为选定的对象快速的修改、添加或删除 HTML 标签。编辑非 HTML 文档Dreamweaver 可以当作文本编辑器使用，来编辑非 HTML 文档。直接在编码视图中编辑JavaScript、XML 和其他的文本文件。 自定义标签库随时定义新的标签或编辑默认标签。Deamweaver 中这一可以再配置的自定义标签库让你可以自己定义来支持个人代码。W3C 标准Dreamweaver 对 W3C 有较高的支持，包括HTML 和 CSS。三、集 成资源管理用新的资源面板在中心位置跟踪网站的各个媒体。预览和管理所有的网站图象、颜色、外部URL、脚本、Macromedia Fla
27、sh、Shockwave、QuickTime 、模板和库元素。保存经常使用的资源并且在网站间重复使用。Microsoft Office 合成简单的合成 Microsoft Office 文件。Clean Up Word HTML 指令用于删除 Microsoft Word 独有标签，表格对象可以让你将图象数据文件导入Dreamweaver。SourceSafe 和 WebDAV 合成将 Dreamweaver 和领先的版本控制软件 Microsoft Visual SourceSafe 合成起来，这让大型开发组织把 Dreamweaver 作为 HTML 前端制作工具。而将 Dreamweav
28、er Site Window 和其他支持WebDAV 协议（源代码控制的 W3C 标准）的内容管理系统或网页服务器合成起来，例如 Windows IIS5 和 Apache。网站报告器使用网站报告器可以快速找到和修复错误。启动报告器，可以查出你网站上的一般问题；你也可以自己编写报告器来查出网站上的一些特殊问题。（一般问题通常是一些 Alt 文本丢失或文档未命名。）设计提示设计提示可以让小组工作更为和谐高效。为每一个源代码文件在一个单独的地方保存注释和状态。可再配置的网站窗口用设计提示，可以在网站窗口中添加自定义专栏。这让开发小组更灵活、简单的督促网站开发工作。网站地图 通过网站地图将为你提供一
29、个网站浏览导航，以便快速进行网站规划和重组。只点击几下鼠标，就可以直接在地图上开设连载版块和建立新的文件，并且在选择文件和图象后在你的网站上建立链接。同步网站 使你的本地和远程网站同步，甚至在两者上同时删除单独的文件。同步网站可以让你简单的更新远程服务器而无需跟踪修改后的文件。完整的 E-Mail 系统 完整的 E-Mail 系统让你的开发组更快更方便的沟通。如果其他人正在检查一个文件，你可以点击他们的姓名，发送 E-Mail。你可以在工作流程标签下的网站定义对话框里输入自己的 E-Mail 地址。可再配置的菜单 一个可编辑的 XML 文件可以帮助你完全自定义整个 Dreamweaver 菜单
30、系统。使用键盘快捷键管理器来自定义新的快捷键或调用预先设定快捷键。Macromedia Exchange 这是一个中心，为 Dreamweaver 提供了上百种容易安装的外围产品。这为你的开发小组提供了可共享的对象、行为和指令。安装这些外围产品只需点击你的鼠标。Dreamweaver 完全教程一、 Dreamweaver 界面及面板 一、 工作界面 网页编辑窗口。1 标题栏。显示网页的标题。2 菜单栏。依次为文件、编辑、视图、插入、修改、文字、命令、站点、视窗和帮助。3 编辑区。在这里编辑网页。4当编辑网页时，显示正在编辑的 HTML 标记5状态栏。显示网页的有关信息。6显示视窗大小，点旁边的
31、小黑三角，可以选择不同的显示尺寸。7显示网页大小，传输速率下网页的下载时间。8状态栏中的启动面板的快捷按钮。 二、启动面板1 启动站点视窗。2 启动元件库编辑器。3 启动 HTML 式样编辑器。4 启动样式表编辑器。5 启动行为编辑器。6 启动历史记录器7 启动 HTML 源文件编辑器。8 竖放启动面板。三、 HTML 式样编辑器快速自定义 HTML 格式。四、 式样表编辑器控制页面元素(如字体大小、颜色等 )的样式。五、 元件库编辑器把常用的元件集中起来，建立一个元件库，可无限次重复使用。 六、 模板编辑器自制模板并可随时编辑。七、 历史记录器记录网页制作的整个过程。八、 Frames 编辑窗口显示 Frame 的划分格式并可对个分格进行编辑。九、 层编辑器显示制作中出现的层。
