FW与DW结合使用细谈
IT产品库 http://www.xuehuiba.com
1 2 3 4 5 6 下一页
Dreamweaver和Fireworks是Macromedia公司的网页制作利器，它们之间具有强大的兼容性，这种无缝连接的特性大大减少了网页设计者进行软件切换的时间，使网页制作和图像处理的效率得到了有效的提高。它们独特的集成功能使得在Fireworks与Dreamweaver之中交替处理文件变得十分容易。Dreamweaver和Fireworks识别和共享许多相同的文件编辑结果，其中包括对链接、图像映射、表格切片等的更改。这两个应用程序共同为在HTML页面中编辑、优化和放置网页图形文件提供了一个优化的工作流程。这里我们将细细介绍Dreamweaver和Fireworks方便快捷的结合使用，领会这两炳利刃的合璧所产生的强大威力，从而为将来实际中的网站建设打下一定的基础。下面我们就来详细了解一下Fireworks MX 2004与Dreamweaver MX 2004结合使用的知识和技巧。
一、使用Dreamweaver占位符创建Fireworks文件
图像占位符允许用户指定Dreamweaver中将来放置的Fireworks图像的大小和位置，可以让我们在网页创建最终的图片之前尝试采用各种不同的网页布局，从而将Fireworks和 Dreamweaver的功能综合运用，发挥二者的强大功能。
在使用Dreamweaver图像占位符创建Fireworks图像时，系统会用与所选占位符尺寸相同的画布创建一个新的Fireworks文档。一旦Fireworks使用结束并且返回到 Dreamweaver，所创建的新Fireworks图形即会取代最初选择的图像占位符。
使用Dreamweaver占位符创建Fireworks文件的具体步骤：
第一步：在Dreamweaver MX 2004中，将所需的HTML文档保存到当前站点下。将光标定位在文档中需要插入Fireworks文件的位置并依次选择“Insert”-〉“Image Objects”-〉“Image Placeholder”选项。然后跳出图像占位符对话框，用户可以如图1所示设置图像占位符的名称、颜色、大小替换文本等内容。
图1 图像占位符对话框
第二步：单击“OK”，图像占位符即会插入到Dreamweaver文档中，如图2所示。
图2 图像占位符
第三步：点击图像占位符属性面板上的按钮，Fireworks MX 2004被启动，出现图3所示的文件窗口。
图3 Fireworks中的图像占位符
第四步：在 Fireworks 中创建图像，完成后单击“Done”。如图4所示,在“另存为”对话框中指定源png文件的名称和位置，然后单击“保存”。
图4 指定图像源文件
第五步：在“Export”对话框中命名导出的图像文件，这些文件是将在Dreamweaver中显示的jpeg或gif文件。然后为导出的图像文件指定位置，所选的位置应在Dreamweaver的站点文件夹内。如果已经输入了图像占位符的名称，则该名称在 Fireworks中将用作默认文件名，如图5所示。
图5 导出文件
第六步：单击“保存”按钮，返回到Dreamweaver，所创建的新Fireworks图像就会取代最初选择的图像占位符，如图6所示。
图6 Fireworks图像取代了图像占位符
IT产品库 http://www.xuehuiba.com www.xuehuiba.com IT产品库 http://www.xuehuiba.com
上一页 1 2 3 4 5 6 下一页
二、 Dreamweaver中插入Fireworks HTML将Fireworks HTML插入到Dreamweaver中有许多不同的方法。用户可以将Fireworks HTML复制到剪贴板；或者利用菜单或者“Insert”面板来直接插入Fireworks HTML文件；也可以在Dreamweaver中打开导出的Fireworks HTML文件，然后复制并粘贴所选的代码片段；另外使用 Fireworks中的“Update HTML”命令还可以轻松地更新导出到Dreamweaver的代码，甚至可以将HTML 导出为Dreamweaver库项目。这些方法各有千秋，用户可以根据具体情况作出选择。