使用 Fireworks 和 Dreamweaver 以简化在 HTML 页面中编辑、优化和放置 Web 图形的工作流程。
该功能在 Adobe Dreamweaver 版本中不受支持。
Dreamweaver 和 Fireworks 将识别并共享许多相同的文件编辑程序,包括对链接、图像地图、表格切片等的更改。此外,这两个应用程序均为在 HTML 页面中编辑、优化和放置 Web 图形文件提供了简化的工作流程。
您可使用“插入图像”命令将 Fireworks 导出图形直接放在 Dreamweaver 文档中,也可通过 Dreamweaver 图像占位符新建 Fireworks 图形。
选择“插入”>“图像”。
在“插入”面板的“常用”类别中,单击“图像”按钮或将其拖动到文档中。
如果 Fireworks 文件不在当前 Dreamweaver 站点中,则将显示一条消息,询问您是否要将此文件复制到根文件夹中。单击“是”。
当您打开并编辑属于 Fireworks 表格的一部分的图像或图像切片时,Dreamweaver 将启动 Fireworks,这将打开从中导出图像或表的 PNG 文件。
以上是假设将 Fireworks 设置为 PNG 文件的主外部图像编辑器的情况下。Firework 在通常情况下是 JPEG 和 GIF 文件的默认编辑器,您可能希望将 Photoshop 设置为这些文件的默认编辑器。
如果图像是 Fireworks 表格的一部分,则可以打开整个 Fireworks 表格进行编辑,只要 HTML 代码中存在 <!--fw table--> 注释。如果源 PNG 文件是从 Fireworks 导出到 Dreamweaver 站点的(使用 Dreamweaver 样式的 HTML 和图像设置),则将在 HTML 代码中自动插入 Fireworks 表格注释。
如果选择了从 Fireworks 导出的图像,则属性检查器会将所选项识别为 Fireworks 图像或表格,并显示 PNG 源文件的名称。
在属性检查器中单击“编辑”。
按住 Ctrl (Windows) 或 Command (Macintosh),同时双击选择的图像。
右键单击 (Windows) 或按住 Ctrl 单击 (Macintosh) 选择的图像,然后从上下文菜单中选择“使用 Fireworks 编辑”。
如果 Fireworks 找不到源文件,则会提示您定位 PNG 源文件。在处理 Fireworks 源文件时,将更改同时保存在源文件和导出的文件中;否则,只有导出的文件会得到更新。
Fireworks 将更改保存在 PNG 文件中,导出更新的图像(或 HTML 和图像),然后将焦点返回 Dreamweaver。在 Dreamweaver 中,将显示更新的图像或表格。
有关 Dreamweaver 和 Fireworks 集成的教程,请参阅 www.adobe.com/go/vid0188_cn。
您可使用 Dreamweaver 快速更改 Fireworks 图像和动画。在 Dreamweaver 中,可以更改优化设置、动画设置以及所导出图像的大小和区域。
选择“命令”>“优化图像”
在属性检查器中单击“编辑图像设置”按钮。
若要编辑优化设置,请单击“选项”选项卡。
若要编辑所导出图像的大小和区域,请单击“文件”选项卡。
可以在 Dreamweaver 文档中创建占位符图像,然后启动 Fireworks 设计图形图像或 Fireworks 表格来替换创建的占位符图像。
要从图像占位符创建新图像,您的系统上必须安装了 Dreamweaver 和 Fireworks。
在属性检查器中单击“创建”。
按 Ctrl (Windows) 或 Command (Macintosh),然后双击图像占位符。
右键单击 (Windows) 或按住 Ctrl 单击 (Macintosh) 图像占位符,然后选择“在 Fireworks 中创建图像”。
Fireworks 将识别您在使用 Dreamweaver 中的图像占位符时设置的下列图像占位符设置:图像大小(其与 Fireworks 画布大小相关)、图像 ID(Fireworks 将其用作您创建的源文件和导出文件的默认文档名)以及文本对齐方式。Fireworks 还将识别您在 Dreamweaver 中工作时附加到图像占位符的链接和特定行为(如交换图像、弹出菜单和设置文本)。
虽然 Fireworks 不会显示已添加到图像占位符的链接,但它们的确会被保留。如果您绘制一个热点并在 Fireworks 中添加一个链接,将不会删除您添加到 Dreamweaver 图像占位符中的链接;但是,如果您剪切 Fireworks 新图像中的切片,则 Fireworks 将在您替换图像占位符时删除 Dreamweaver 文档中的链接。
Fireworks 不识别以下图像占位符设置:图像对齐方式、颜色、垂直边距和水平边距以及映射。在图像占位符的属性检查器中,这些设置处于禁用状态。
如果您在将图像占位符插入 Dreamweaver 文档时已为其命名,则 Fireworks 会使用该名称填充“文件名”框。可以更改此名称。
将出现“导出”对话框。使用此对话框将图像导出为 GIF 或 JPEG 文件;对于经过切片的图像,则可导出为 HTML 和图像。
“名称”框中会自动显示用于 PNG 文件的名称。可以更改此名称。
将保存文件,并且焦点将返回 Dreamweaver。在 Dreamweaver 文档中,导出的文件或 Fireworks 表格将替换图像占位符。
您可以使用 Fireworks 快速方便地创建基于 CSS 的弹出菜单。
除了提供扩展性和较快的下载速度之外,使用 Fireworks 创建的弹出菜单还提供了以下优势:
菜单项可以由搜索引擎进行索引。
屏幕阅读器可以读取菜单项,使您的页面具有更高的可访问性。
Fireworks 生成的代码符合标准且可进行验证。
您可使用 Dreamweaver 或 Fireworks 编辑 Fireworks 弹出菜单,但不能同时使用二者进行编辑。Fireworks 中不会保留在 Dreamweaver 中进行的更改。
可以在 Fireworks 8 或更高版本中创建弹出菜单,然后使用 Dreamweaver 或 Fireworks 编辑此菜单(使用往返编辑),但不能同时使用二者进行编辑。如果您先在 Dreamweaver 中编辑菜单,然后在 Fireworks 中编辑它们,则将丢失文本内容之外的所有之前的编辑。
如果您更喜欢使用 Dreamweaver 编辑菜单,可以使用 Fireworks 创建弹出菜单,然后只使用 Dreamweaver 编辑和自定义菜单。
如果您更喜欢在 Fireworks 中编辑菜单,可以使用 Dreamweaver 中的往返编辑功能,但是不应直接在 Dreamweaver 中编辑菜单。
将在 Fireworks 中打开源 PNG 文件。
Fireworks 会将已编辑的弹出菜单发送回 Dreamweaver。
如果您在 Fireworks MX 2004 或早期版本中创建了一个弹出菜单,可使用“行为”面板中可用的“显示弹出菜单”对话框在 Dreamweaver 中编辑此弹出菜单。
在使用 Fireworks 编辑图像时,网页中的图像通常是 Fireworks 根据某个源 PNG 文件导出的。当您在 Dreamweaver 中打开一个图像文件以进行编辑时,Fireworks 将自动打开源 PNG 文件,如果找不到 PNG 文件,将提示您进行查找。如果您喜欢,可在 Fireworks 中设置偏好设置以让 Dreamweaver 打开插入的图像,也可让 Fireworks 在您每次在 Dreamweaver 中打开图像时,为您提供使用插入的图像文件或 Fireworks 源文件的选项。
Dreamweaver 仅在特定情况下才识别 Fireworks 启动和编辑偏好设置。具体而言,您打开和优化的图像不能是 Fireworks 表格的一部分,并且必须包含指向源 PNG 文件的正确的设计备注路径。
始终使用源 PNG
自动打开在“设计备注”中定义为所放置图像来源的 Fireworks PNG 文件。源 PNG 文件和对应的已放置图像均会发生更新。
永不使用源 PNG
无论是否存在源 PNG 文件,均自动打开所放置的 Fireworks 图像。仅会更新所放置的图像。
启动时询问
显示一条信息,询问是否打开源 PNG 文件。您还可以从此消息中指定全局性的“启动并编辑”偏好设置。
从 Fireworks 中,您可以使用导出命令将优化的图像和 HTML 文件导出并保存到 Dreamweaver 站点文件夹内的位置。然后可以将文件插入 Dreamweaver。Dreamweaver 允许您将 Fireworks 生成的 HTML 代码(包括相关图像、切片和 JavaScript)插入文档。
选择“插入”>“图像对象”>“Fireworks HTML”。
在“插入”面板的“常用”类别中,单击“图像”按钮,然后从弹出菜单中选择“插入 Fireworks HTML”。
如果该 HTML 文件位于某个网络驱动器上,它将被永久删除,而不会移动到回收站或垃圾桶。
以下方法可快速将 Fireworks 生成的图像和表格放置到 Dreamweaver 中:复制 Fireworks HTML 代码并将其直接粘贴到 Dreamweaver 文档中。
向导将图像导出到指定的目标位置并将 HTML 代码复制到剪贴板。
与您导出的 Fireworks 文件关联的所有 HTML 和 JavaScript 代码将复制到 Dreamweaver 文档中,并且将更新指向图像的所有链接。
与您导出的 Fireworks 文件关联的所有 HTML 和 JavaScript 代码将复制到 Dreamweaver 文档中,并且将更新指向图像的所有链接。
在 Fireworks 中,“文件”>“更新 HTML”命令将替代更新放置在 Dreamweaver 中的 Fireworks 文件的启动和编辑方法。使用“更新 HTML”,您可在 Fireworks 中编辑源 PNG 图像,然后自动更新 Dreamweaver 文档中放置的任何导出的 HTML 代码和图像文件。此命令使您能够更新 Dreamweaver 文件,即使 Dreamweaver 未运行时也可更新。
Fireworks 更新 Dreamweaver 文档中的 HTML 和 JavaScript 代码。此外,Fireworks 还会导出与 HTML 相关的已更新图像,并将这些图像放置在指定的目标文件夹中。
如果 Fireworks 找不到匹配的待更新 HTML 代码,您可以选择将新的 HTML 代码插入 Dreamweaver 文档。Fireworks 将新代码的 JavaScript 部分放在文档的开头处,将 HTML 表格或图像链接放在末尾处。
“创建 Web 相册”功能从 Dreamweaver CS5 开始已被弃用。
登录到您的帐户