| 一、导出HTML代码 用Fireworks切割图像、创建按钮和使用行为都会产生HTML代码,将这些HTML代码保存在HTML文件中,就可以在Dreamweaver中调用它了。下面我们就来看看如何在Dreamweaver中使用这些HTML文件。
假设我们已经使用Fireworks创建一个包含热点、切片和行为的图像。单击“Export”(导出)按钮,打开文件保存类型的下拉列表,选择导出的文件为“HTML and Images”。另外在保存对话框右边还有一个“Options”按钮,单击它后,弹出“HTML Setup”对话框,可以设置HTML适用于“Dreamweaver“、“Frontpage”、“GoLive”等网页制作软件。
再选择文件保存的位置,输入文件名比如endweb后,单击保存按钮。打开保存图像文件夹后,你会发现文件夹中出现了许多以endweb开头的图形文件和一个endweb.htm文件。这是因为使用了割图,Fireworks将切割的每小块图片分别存成不同的图像文件。打开Dreamweaver,单击对象工具栏上插入Fireworks的HTML文件按钮。单击浏览按钮,在图像所在的文件夹中单击Fireworks选择HTML文件,然后单击打开按钮。单击OK按钮,整个Fireworks图像已经导入到了Dreamweaver文件中,而且Dreamweaver自动将Fireworks切割的每一小块图片结合在一起。按一下“F12”键,在浏览器中预览页面,移动鼠标,可以发现在Fireworks中使用javascript创建的按钮、切换图片等功能依然存在。
二、导出CSS文件 在Fireworks中我们还经常使用图层,在Dreamwever中也有层的概念,这种层是使用CSS样式来实现的。首先我们将Fireworks中的图像导出成CSS格式,单击“Export”(导出)按钮,打开文件的保存类型下拉列表,选择导出文件为“CSS Layer(.htm)”。选择导出文件的位置后,单击保存按钮。切换到Dreamweaver程序中,打开“File”菜单,选择“Open”命令。选择在Fireworks中保存的CSS层文件。在Dreamwever的层面板上就会看到原来在Fireworks中不同层上的对象导入Dreamwever后出现在不同的CSS层中。
三、导出库文件 Dreamwever中有一个库面板,在库面板上可以放文字、表格、表单、图像等重复使用的对象,当然也可以使用Fireworks导出图像。切换到Fireworks程序,打开一个文件。在Fireworks中单击“Export”(导出)按钮,打开文件的保存类型下拉列表,选择导出的文件为“Dreamweaver Library(.lbi)”。库文件必须保存在网站根目录下的“Library”库文件夹中,输入文件名,单击保存按钮。切换到Dreamweaver程序中,在库面板上就会出现我们在Fireworks中导出的图像。将图像从库面板拖到工作区的方式就可以多次使用该对象。
四、导出SWF文件 Fireworks除了导出供Dreamweaver使用的文件,还可以导出Flash格式的SWF文件。单击“Export”(导出)按钮,打开文件的保存类型下拉列表,选择导出的文件为“Flash SWF格式”。当输入格式为“Flash SWF”时,单击对话框中的“Options”按钮后,可以设置导出文件的属性,在这个对话框中可以设定原Fireworks中的矢量对象是否保存可编辑的路径。如果导出成位图的格式,可以选择质量,还可以设置速度,如图4所示。输入文件名后,单击保存按钮。打开Flash程序,打开文件菜单,选择导入命令。选择Fireworks导出文件后,单击打开按钮就可以将图像导入Flash中。原来多帧的动画文件导入Flash后还保持原来的帧。
另外Fireworks的导出类型还提供了“Images Only”、“Director”、“Layer to Files”、“Frames to Files”、“Lotus Domino Designer”、“Illustrator 7”、“Photoshop PSD”等格式以满足使用不同制作软件的用户。
|